Yahoo Answers is shutting down on May 4th, 2021 (Eastern Time) and beginning April 20th, 2021 (Eastern Time) the Yahoo Answers website will be in read-only mode. There will be no changes to other Yahoo properties or services, or your Yahoo account. You can find more information about the Yahoo Answers shutdown and how to download your data on this help page.
Trending News
Internet Explorer Displays a Gap in CSS?
Screenshot of problem...
http://i88.photobucket.com/albums/k169/sig331/css_...
html code...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitiona...
<html xmlns="http://www.w3.org/1999/xhtml%22%3E
<head>
<link rel="stylesheet" type="text/css" href="nlg_style.css" />
</head>
<body bgcolor = "#989687">
<img src = "nlg.jpg"/><img src= "top.jpg"/>
<div id="page_nav">
<div class="nav_main">stuff</div>
</div>
</body>
</html>
CSS...
body
{
background-color: #989687;
padding: 0;
margin: 0;
}
#page_nav
{
float: left;
width: 159px;
}
.nav_main
{
padding: 5px 0px 0px 18px;
font-weight: bold;
background: Transparent url(lbar_bg.gif);
background-repeat: repeat-y;
}
Images...
http://i88.photobucket.com/albums/k169/sig331/lbar...
http://i88.photobucket.com/albums/k169/sig331/top....
Is there something I can put in there to get IE to render the page correctly?
The gap appears between the top.jpg image and the nav_main div...
<img src= "top.jpg"/>
<div id="page_nav">
<div class="nav_main">stuff</div>
2 Answers
- 1 decade agoFavorite Answer
Fixed:
The problem is, IE will stick spaces in between images (no idea why). The hack is to use background images in DIVs.
External CSS file:
body
{
background-color: #989687;
padding: 0 0 0 0;
margin: 0 0 0 0;
}
#page_nav
{
float: left;
width: 159px;
}
.nav_main
{
padding: 5px 0px 0px 18px;
font-weight: bold;
background: Transparent url(lbar_bg.gif) repeat-y;
}
#nlg
{
height: 163px;
width: 799px;
background: Transparent url(nlg.jpg) no-repeat;
}
#top
{
height: 26px;
width: 796px;
background: Transparent url(top.jpg) no-repeat;
}
HTML File:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitiona...
<html xmlns="http://www.w3.org/1999/xhtml%22%3E
<head>
<title>CSS Test</title>
<link rel="stylesheet" type="text/css" href="nlg_style.css" />
</head>
<body>
<div id="nlg">
</div>
<div id="top">
</div>
<div id="page_nav">
<div class="nav_main">
This is a test to get a bit more space on this DIV</div>
</div>
</body>
</html>
- 1 decade ago
Try modifying this line:
<img src = "nlg.jpg"/><img src= "top.jpg"/>
to:
<div><img src = "nlg.jpg"/><img src= "top.jpg"/></div>
IE can sometimes get strange with spaces after img tags.
Liggy :^)
