I have a 18x6 picture from which I put the same style values, but when viewing it in IE, it shows as 18x19.
Can any one help please?
Attached are the html and css files. The image was put in the "leftbarmenubottom" DIV (bottom of the pages).
Thanks.<img src=http://www.webdeveloper.com/forum/archive/index.php/"myimage" style="width: 18px; height: 6px;" /> ? (take off the / before the > if you're using HTML 4.01)It's still the same :SHere are the codes used:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href=http://www.webdeveloper.com/forum/archive/index.php/"theme.css">
</head>
<body>
<div class="container" style="width: 760px; height: 80px;">
<div class="bannerbg" style="width: 760px; height: 80px;">
</div>
<div class="banner" style="width: 524px; height: 40px">
</div>
<div class="logo" style="width: 79px; height: 78px;">
</div>
<div class="topleft" style="width: 17px; height: 17px;">
</div>
<div class="topbarblue" style="width: 358px; height: 21px;">
</div>
<div class="topbarcenter" style="width: 22px; height: 20px;">
</div>
<div class="topbarwhite" style="width: 361px; height: 21px;">
</div>
<div class="topbarright" style="width: 2px; height: 20px;">
</div>
<div class="leftbartop" style="width: 19px; height: 43px;">
</div>
<div class="leftbarmenu" style="width: 15px; height: 183px;">
</div>
<div class="leftbarmenubottom" style="width: 18px; height: 6px;">
</div>
</div>
</body>
</html>
CSS code:
<!--
div.container {
width:80%;
position: absolute;
top: 0%;
left: 0%;
}
div.bannerbg {
position: absolute;
top: 0px;
left: 0px;
background-color: #00adef;
}
div.banner {
position: absolute;
top: 20px;
left: 176px;
background: url(gfx/banner.gif);
}
div.logo {
position: absolute;
top: 1px;
left: 50px;
background: url(gfx/iba_logo.gif);
}
div.topleft {
position: absolute;
top: 63px;
left: 0px;
background: url(gfx/top_left.gif);
}
div.topbarblue {
background: url(gfx/top_bar_blue.gif);
position: absolute;
top: 80px;
left: 17px;
background-repeat: repeat-x
}
div.topbarcenter {
position: absolute;
top: 80px;
left: 375px;
background: url(gfx/top_bar_center.gif);
}
div.topbarwhite {
background: url(gfx/top_bar_white.gif);
position: absolute;
top: 80px;
left: 397px;
background-repeat: repeat-x
}
div.topbarright {
position: absolute;
top: 80px;
left: 758px;
background: url(gfx/top_bar_right.gif);
}
div.leftbartop {
position: absolute;
top: 80px;
left: 0px;
background: url(gfx/left_bar_top.gif);
}
div.leftbarmenu {
background: url(gfx/left_bar_menu.gif);
position: absolute;
top: 123px;
left: 0px;
background-repeat: repeat-y
}
div.leftbarmenubottom {
position: absolute;
top: 310px;
left: 0px;
background: url(gfx/left_bar_menu_bottom.gif);
}
-->div.leftbarmenubottom {
position: absolute;
top: 310px;
left: 0px;
background: url(gfx/left_bar_menu_bottom.gif);
font-size:0;
}
Thank you!!! Thank you!!! Thank you!!!
Can any one help please?
Attached are the html and css files. The image was put in the "leftbarmenubottom" DIV (bottom of the pages).
Thanks.<img src=http://www.webdeveloper.com/forum/archive/index.php/"myimage" style="width: 18px; height: 6px;" /> ? (take off the / before the > if you're using HTML 4.01)It's still the same :SHere are the codes used:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href=http://www.webdeveloper.com/forum/archive/index.php/"theme.css">
</head>
<body>
<div class="container" style="width: 760px; height: 80px;">
<div class="bannerbg" style="width: 760px; height: 80px;">
</div>
<div class="banner" style="width: 524px; height: 40px">
</div>
<div class="logo" style="width: 79px; height: 78px;">
</div>
<div class="topleft" style="width: 17px; height: 17px;">
</div>
<div class="topbarblue" style="width: 358px; height: 21px;">
</div>
<div class="topbarcenter" style="width: 22px; height: 20px;">
</div>
<div class="topbarwhite" style="width: 361px; height: 21px;">
</div>
<div class="topbarright" style="width: 2px; height: 20px;">
</div>
<div class="leftbartop" style="width: 19px; height: 43px;">
</div>
<div class="leftbarmenu" style="width: 15px; height: 183px;">
</div>
<div class="leftbarmenubottom" style="width: 18px; height: 6px;">
</div>
</div>
</body>
</html>
CSS code:
<!--
div.container {
width:80%;
position: absolute;
top: 0%;
left: 0%;
}
div.bannerbg {
position: absolute;
top: 0px;
left: 0px;
background-color: #00adef;
}
div.banner {
position: absolute;
top: 20px;
left: 176px;
background: url(gfx/banner.gif);
}
div.logo {
position: absolute;
top: 1px;
left: 50px;
background: url(gfx/iba_logo.gif);
}
div.topleft {
position: absolute;
top: 63px;
left: 0px;
background: url(gfx/top_left.gif);
}
div.topbarblue {
background: url(gfx/top_bar_blue.gif);
position: absolute;
top: 80px;
left: 17px;
background-repeat: repeat-x
}
div.topbarcenter {
position: absolute;
top: 80px;
left: 375px;
background: url(gfx/top_bar_center.gif);
}
div.topbarwhite {
background: url(gfx/top_bar_white.gif);
position: absolute;
top: 80px;
left: 397px;
background-repeat: repeat-x
}
div.topbarright {
position: absolute;
top: 80px;
left: 758px;
background: url(gfx/top_bar_right.gif);
}
div.leftbartop {
position: absolute;
top: 80px;
left: 0px;
background: url(gfx/left_bar_top.gif);
}
div.leftbarmenu {
background: url(gfx/left_bar_menu.gif);
position: absolute;
top: 123px;
left: 0px;
background-repeat: repeat-y
}
div.leftbarmenubottom {
position: absolute;
top: 310px;
left: 0px;
background: url(gfx/left_bar_menu_bottom.gif);
}
-->div.leftbarmenubottom {
position: absolute;
top: 310px;
left: 0px;
background: url(gfx/left_bar_menu_bottom.gif);
font-size:0;
}
Thank you!!! Thank you!!! Thank you!!!