Title: Help with CSS problem
Last modified: August 18, 2016

---

# Help with CSS problem

 *  [jinsan](https://wordpress.org/support/users/jinsan/)
 * (@jinsan)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/)
 * [http://reviews.sekhu.net/](http://reviews.sekhu.net/)
 * Hey it’s me again, you know love me.
 * Anyway, I’ve been doing my head in trying to get the site to work for me the 
   way I want. I’ts CSS valid, it’s XHTML valid. But it’s not design valid.
 * In FF (and IE, I dunno) note the bar below the header image and above the navbar.
 * What I am trying to do is get the footer closer in, so that page is static and
   doesn’t scroll. Right now it has a 2-3px scrolling which is driving me round 
   the bend.
 * I think this is where the problem is…
 * `#masthead {<br />
    position: relative;<br /> top: 5px;<br /> background: #99CC66
   url('images/masthead.jpg') no-repeat;<br /> width: 513px;<br /> height: 250px;
   <br /> margin-left: 0px;<br /> margin-top: -6px;<br /> }
 * `#navbar {<br />
    background: url('images/navbar.jpg') no-repeat;<br /> position:
   relative;<br /> left: 0px;<br /> top: 0px;<br /> width: 513px;<br /> height: 
   46px;<br /> margin-bottom: 15px;<br /> padding: 0px;<br /> text-align: center;
   <br /> }
 * I’ve tried to add a margin-top: -5px to the navbar – but it “borks” the page 
   and everything shifts including the background. I do a margin-bottom: -5px and
   it does the same. Changing the min-height also does the same thing.
 * I’ve been trying to get the footer closer to the top and it worked increments
   and then after which it starts messing up.
 * Can someone help? Thanks in advance

Viewing 8 replies - 1 through 8 (of 8 total)

 *  [Mark (podz)](https://wordpress.org/support/users/podz/)
 * (@podz)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157591)
 * ” so that page is static and doesn’t scroll.”
 * Not sure what you mean .. I have a 1024*768 screen size – should I be seeing 
   a scroll ?
 *  Thread Starter [jinsan](https://wordpress.org/support/users/jinsan/)
 * (@jinsan)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157594)
 * er…..
 * Hmmm….
 * There shouldn’t be a scroll bar on the right. Ok let me clear that bit. I know
   user will need to scroll to view the content depending on the length of the content,
   as of now the page doesn’t have a lot of content so the page shouldn’t have that
   extra 2-3px vertical scroll on the scroll bar. Which it does – if I can fix the
   bar at the top then I think it will fix the page. Basically ignore the scroll
   ramble 🙂
 * Any ideas on what to do to fix the flaw in the gap between header and navbar?
 *  [Mark (podz)](https://wordpress.org/support/users/podz/)
 * (@podz)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157598)
 * [http://www.tamba2.org.uk/downloads/jinsan.jpg](http://www.tamba2.org.uk/downloads/jinsan.jpg)
 * By flaw, do you mean that horizontal bar just above the nav links ?
 * (It’s your design … you know what you mean, but I don’t -if you see what I mean).
   the scroll is there too.
 *  [Mark (podz)](https://wordpress.org/support/users/podz/)
 * (@podz)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157602)
 * If it is that bar, play with the values in #masthead
 * (Btw, I really like your design !)
 *  [lawtai](https://wordpress.org/support/users/lawtai/)
 * (@lawtai)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157603)
 * ideally, you should be able to achieve what you’re trying to do without -px’s.
   Don’t forget that you need to take into account extra pixels that are created
   by any borders you add, so you could be a few pixels off here and there with 
   the more borders you have.
 *  [simdesigns](https://wordpress.org/support/users/simdesigns/)
 * (@simdesigns)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157606)
 * From what I can see, your page doesn’t need positioning to achieve the look it
   has now. It’s postioning that usually messes up a perfectly good CSS layout. 
   Try stacking the divs one on top of the other, don’t use height attributes unless
   neccesary, and to get the box with a box look, use a or a <div> within a div 
   with padding set to whatever values you want, and text-align for the outer container
   set to center.
 * Your space problem is probably a direct result of some margin or padding you 
   set before, coupled with the positioning thing.
 * See if that helps.
 *  [Root](https://wordpress.org/support/users/root/)
 * (@root)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157628)
 * Well I am not surprised. As I read the markup #masthead opens and closes with
   nothing in it. The CSS will have no effect.
 *  Thread Starter [jinsan](https://wordpress.org/support/users/jinsan/)
 * (@jinsan)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157655)
 * [@simdesigns](https://wordpress.org/support/users/simdesigns/) – I’m having to
   use the height attribute for both the masthead and the navbar, otherwise it disappears.
   Though I’m interested in hear about your div within a div idea, an example would
   be?
 * [@root](https://wordpress.org/support/users/root/) could you elaborate?
 * [@podz](https://wordpress.org/support/users/podz/) – that’s the bugger I’m trying
   to fix. However, what I found was playing with the masthead values and vnavabr
   to align almost worked. The only time the page messes up is when the gap is removed–
   so there’s some extra pixels I think, but I can’t figure out where.
 * I did the theme for my blog site here: [http://sekhu.net/wp/](http://sekhu.net/wp/)
   where it does work – but with this I reduced the min-height (remoing it borked
   the page) and reduced the size of the masthead image and some other changes.
 * Think I might just scrap it and leave it be, I don’t think it’s a theme that 
   could really be used by anyone other than someone who visits mcdonalds or owns
   a farm, or knows a man named mcdonald who owns a farm….ah well

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Help with CSS problem’ is closed to new replies.

 * 8 replies
 * 5 participants
 * Last reply from: [jinsan](https://wordpress.org/support/users/jinsan/)
 * Last activity: [21 years, 3 months ago](https://wordpress.org/support/topic/help-with-css-problem/#post-157655)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics