2px gap between Navbar / Topbar

Z

Zylo

New Member
Hi,

I am designing a very simple layout using CSS.

The site has a topbar, a vertical navbar on the left and page content to the right.

The problem I am running into is that there seems to be a 2pixel gap in between the topbar and my navbar... It is perfectly aligned in dreamweaver but when uploaded and viewed with either IE8beta or Firefox, the gap is there.

The site is layed out with one large container and divisions positioned relative within it.

Website Address: http://www.redrescue.ca
CSS Address: http://www.redrescue.ca/css/mycss.css

If anyone can solve this riddle I would thrilled because I'm beating my head against the wall on this one..

Thanks!
 
S

starteasy

New Member
Yeah it's one of the downsides to Dreamweaver, you can easily overlook something that is in essence quite simple. By default, the page properties have no values for margins. This creates a default gap between header and top of browser view screen.

To fix this, you can either enter "0" into all the margin fields, or even better, when using css, enter:

margin: 0;

to your "body" css class that you already have.

See how that goes.
 
R

rarepearldesign

New Member
Its actually 5px.

Your top bar has a height of 165px but the images in the bar are only 160px tall. That leaves 5 px of space below the top bar such that the side bar cannot jam up next to it.
 
Z

Zylo

New Member
Thank you for the help/advice.

The fix: I had to specify the "height" in #topbar to 160px.

This worked perfectly

:)
 
You must log in or register to reply here.
Top