Click to See Complete Forum and Search --> : [RESOLVED] Layout Troubles


dtm32236
08-06-2008, 08:34 AM
So, I thought I was pretty good at this HTML/CSS stuff, but apparently I still suck at it, lol.

Anyway, I've attached a zip - it's just one page of a site and I'm having troubles with the shield graphic on the right hand side. In FF, it looks perfect, the shield is floated to the right, and the main content of the site floats around it perfectly. In IE it didn't work out so great (of course)... the problems in IE are obvious.

I've tried so many different workarounds, but can't seem to get anything to work. It's probably pretty simple, but would anyone take a look and see if you have any solutions to this?

Thanks so much guys!

Centauri
08-06-2008, 09:14 AM
The position of the navigation bar is dependant not only on the height of the logo graphic, but also the gap below for text descenders that is always present on inline elements, and the size of this can vary between browsers (and font size). Convert the graphic to block display and set the bottom padding to suit :<img src="images/pint-meisers-logo.jpg" alt="Pint Meisers logo" style="display:block; padding-bottom: 5px;">

dtm32236
08-06-2008, 09:56 AM
Wow - thanks so much, Centauri... that worked perfectly. You're awesome.

I should've known to try display:block on the image.