Home | Contact Us | FAQ | Search & Site Map | Link to Us
Sign In | Join | Other 45 Sites in Network
Home
Discussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers

Webmaster Forum / HTML, CSS, Scripts / CSS / November 2005



Tip: Looking for answers? Try searching our database.

1px gap between divs in IE for win

Thread view: 
Enable EMail Alerts  Start New Thread
Thread rating: 
arielwfox@hotmail.com - 07 Nov 2005 05:10 GMT
Hi everyone.
This is my first attempt with CSS and I've run into a little problem
when it's viewed in IE 6 for Windows. It looks fine in Firefox, Safari,
Opera, and IE on the mac.
I've read through tons of postings and tried everything I can think of,
but I just can't seem to get rid of this small gap between my
div#header and div#topnav.
I'd love any suggestions. I'm eager to learn so if you have any other
suggestions about my style sheet please let me know.
Thanks!
Ariel

page is here:
http://www.stickersisters.com/newsite/index4.htm

full css is here:
http://www.stickersisters.com/newsite/stickersisters4.css

here's the section I'm having the problem with:

<div id="mainwrap">
<div id="header"><img src="images_content/penbanner4.gif" alt="Sticker
Sisters" width="774" border="0"/>
</div> <!-- end header "banner"-->
<div id="topnav">
<div id="topnavcontainer">
<ul>
<li> <a href="">home</a></li>
<li> <a href="">shop</a></li>
<li> <a href="">about</a></li>
<li> <a href="">blog</a></li>
<li> <a href="">activism</a></li>
<li> <a href="">links</a></li>
</ul>
</div><!--end top nav container-->
</div> <!-- end top nav-->

-------------------------------------------------------------------------------
here's the css for that section:

body {margin:0px; padding:0px; font: 1.0em arial, verdana, sans-serif;
text-align:center;background-color:#330033;}
* {margin:0; padding:0; }

div#mainwrap {width:774px; margin-left:auto; margin-right:auto;
margin-top:0; text-align:left;}
div#header {width:774px; height:103px; margin:6px 0 0 0;
background-color:#330033; text-align:center; }
div#topnav {width:774px; height:36px; background-color:#CCCCFF;
text-align:center; margin:0; padding-top: 8px;}
div#topnavcontainer ul{list-style-type:none; margin:0; padding:0;
text-align:center; }
div#topnavcontainer ul li {display: inline; font-size: 1em;
font-weight:bold; }
div#topnavcontainer ul li a{text-decoration:none; padding:.2em 1em;
color: #330033;}
div#topnavcontainer ul li a:hover{color:#003333;}
twaddle - 07 Nov 2005 06:32 GMT
> I just can't seem to get rid of this small gap between my

> page is here:
> http://www.stickersisters.com/newsite/index4.htm

> full css is here:
> http://www.stickersisters.com/newsite/stickersisters4.css

> <div id="mainwrap">
> <div id="header"><img src="images_content/penbanner4.gif" alt="Sticker
> Sisters" width="774" border="0"/>
> </div> <!-- end header "banner"-->

It's the same old problem as occurs with images in tables. Get rid of
the linebreak (in the code) after the image.
<div><img></div>
Making the image 'display: block' should also work.

twaddle
arielwfox@hotmail.com - 07 Nov 2005 21:36 GMT
that was simple! got rid of the linebreak after the image and it works
perfectly. thanks so much.
Spartanicus - 07 Nov 2005 08:25 GMT
>but I just can't seem to get rid of this small gap between my
>div#header and div#topnav.

img{vertical-align:text-bottom}

Signature

Spartanicus

meltedown - 27 Nov 2005 01:52 GMT
> Hi everyone.
> This is my first attempt with CSS and I've run into a little problem
[quoted text clipped - 10 lines]
> page is here:
> http://www.stickersisters.com/newsite/index4.htm
File Not Found
The requested URL was not found on this server.

> full css is here:
> http://www.stickersisters.com/newsite/stickersisters4.css
[quoted text clipped - 38 lines]
> color: #330033;}
> div#topnavcontainer ul li a:hover{color:#003333;}
meltedown - 27 Nov 2005 01:54 GMT
>> Hi everyone.
>> This is my first attempt with CSS and I've run into a little problem
[quoted text clipped - 13 lines]
> File Not Found
> The requested URL was not found on this server.

oops. I thought I was responding to a new post, but its from 3 weeks ago
and has already been answered. my mistake.
 
Sign In
Join
My Latest Posts
My Monitored Threads
My Blog
My Photo Gallery
My Profile
My Homepage

Start New Thread
Enable EMail Alerts
Rate this Thread



©2009 Advenet LLC   Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.