kilka razy już miałem podobny problem, jakoś sobie radziłem, jednak tym razem walczę, walczę i niestety
powoli się poddaję
Mianowicie problem jest następujący: ustawiłem tło + wypozycjonowałem wszystko tak jak chciałem w CSS (pionowo pośrodku), warstwa która ma być wyśrodkowana pio
owo ma mieć szerokość
100% okna przeglądarki i tu właśnie pojawia się problem... Ustawiłem width: 100%, odpalam na Operze - OK,
FF - OK, IE -
w ogóle nie widać div'a.Poniżej wklejam kod html i 2 CSSy.
HTML:
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link href="styl/styl.css" rel="stylesheet" type="text/css"/>
<!--[if lte IE 7]>
<link href="styl/styl_ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if lte IE 6]>
<link href="styl/styl_ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
</head>
<body>
<div id="wrap">
<div id="cell">
<div id="black_line">
<div style="width: 100%; height: 100%;"></div>
</div>
</div>
</div>
</body>
</html>
CSS ogólny:
CODE
/* CSS Document */
html, body {
height: 100%;
width: 100%;
}
body {
display: table;
margin: 0;
padding: 0;
background: #615d5c;
}
#wrap {
display: table-cell;
vertical-align: middle;
}
#black_line {
width: 100%;
height: 400px;
background: #141517;
position: relative;
}
CSS dla IE:
CODE
/* CSS Document */
html {
overflow-y: hidden;
overflow-x: hidden;
}
body {
position: relative;
}
#wrap {
position: absolute;
top: 50%;
}
#cell {
position: relative;
top: -50%;
}
PS. Szukałem na sieci, ale nie mogłem znaleźć niczeg co by mi pomogło, proszę zatem o możliwie szybką pomoc.
i już sprawa rozwiązana, powalczyłem jeszcze trochę i udało się wygrać z kochanym IE
Sam nie wiem do końca od czego to zależy, dopisałem jeszcze kilka linii kodu, wstawiłem
div'a w div'a, który był wcześniej niewidoczny i działa