barakgil
07-19-2007, 04:38 AM
Hi all,
first i appologize if this problem as risen before but i couldn't find any post about it. i'm creating a banner for my group's site and i'm positioning a text above a background image. the text must be positioned at a precise location otherwise it interfere with the image. to do so i've set precise font size and line-height. of course in firefox it's good but IE6 cuts the text in the middle.
here's the code:
CSS
"/* Generated by CaScadeS, a stylesheet editor for Mozilla Composer */
.BG { border-style: none;
color: rgb(255, 255, 255);
font-size: 25px;
line-height: 5px;
font-style: normal;
font-weight: bold;
text-align: center;
background-image: url('banner.jpg');
background-repeat: repeat-x;
z-index: 1;
position: absolute;
overflow: auto;
width: 100%;
height: 120px;
top: 0px;
left: 0px;
display: inline;
margin-left: 0px;
margin-right: opx;
}
"
file
"
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>banner</title>
<link rel="stylesheet" type="text/css" href="top.css">
</head>
<body scroll="no">
<div class="BG">
<br>
<div style="text-align: center;"><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
BioPhysics Group</div>
</div>
</body>
</html>
"
the image itself is not improtant but the text position must remain the same as it is now.
this stupid problem is annoying me for hours and i'm building up an urge to automatically fire at microsoft employees. please, help me to prevent a horrible crime.
first i appologize if this problem as risen before but i couldn't find any post about it. i'm creating a banner for my group's site and i'm positioning a text above a background image. the text must be positioned at a precise location otherwise it interfere with the image. to do so i've set precise font size and line-height. of course in firefox it's good but IE6 cuts the text in the middle.
here's the code:
CSS
"/* Generated by CaScadeS, a stylesheet editor for Mozilla Composer */
.BG { border-style: none;
color: rgb(255, 255, 255);
font-size: 25px;
line-height: 5px;
font-style: normal;
font-weight: bold;
text-align: center;
background-image: url('banner.jpg');
background-repeat: repeat-x;
z-index: 1;
position: absolute;
overflow: auto;
width: 100%;
height: 120px;
top: 0px;
left: 0px;
display: inline;
margin-left: 0px;
margin-right: opx;
}
"
file
"
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>banner</title>
<link rel="stylesheet" type="text/css" href="top.css">
</head>
<body scroll="no">
<div class="BG">
<br>
<div style="text-align: center;"><br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
BioPhysics Group</div>
</div>
</body>
</html>
"
the image itself is not improtant but the text position must remain the same as it is now.
this stupid problem is annoying me for hours and i'm building up an urge to automatically fire at microsoft employees. please, help me to prevent a horrible crime.