HTML & CSSur HTML, XHTML & CSS
9 svar · 385 visningar · startad av pakmannen
Hejsan. Okej, om man vill få en div att fylla hela höjden, alltså på samma sätt som height="100%" gör med tabeller, hur gör man då? Läste lite om att testa height: auto, men det fungerar inte alls, den blir bara några pixlar hög. Och height: 100% fungerar inte heller, men det visste jag redan.
Hur gör man?
Ja, men det fungerar inte.
Jag tror inte man kan använda % i height om man använder css.
Klart man kan använda procent i CSS.
Det här funkar utmärkt för mig:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv">
<head>
<title></title>
</head>
<body style="height: 100%">
<div style="height: 100%; border: 1px solid #555;">Lager</div>
</body>
</html>
*Ähum* Det där funkar prima i MSIE, men det räcker inte riktigt till för att få det att funka i Mozilla och vissa andra mer "strikta" webbläsare ...
Man behöver sätta 100% på både html- och body-elementen för att det skall funka i det mesta ;)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" >
<style type="text/css">
<!--
html, body { height:100%; margin:0; padding:0px; }
-->
</style>
</head>
<body>
<div style="height: 100%; background-color:silver">Lager</div>
</body>
</html>
jarvklo: Det där gjorde susen! Tack så mycket!
En annan grej dock, om man nu vill centrera diven?
I MSIE fungerar det med text-align: center i body
men det fungerar inte i Mozilla, Opera etc.
<div style="height: 100%; background-color:silver; margin:auto;">Lager</div>
height="100%" på tabeller fungerar inte i XHTML strict.. har slitit mitt hår över det.. =(
Hmm....
Om det är ett problem som liknar det vi diskuterade i http://www.webforum.nu/showthread.php?s=&threadid=77213 så går det, som sagt, att lösa...
Prova att köra http://member.webforum.nu/2241/striktetthundraprocenttabell.html som är ett omhack av din kod från den tråden som validerar som xhtml 1.0 Strict.
Om jag missuppfattat dig nu, så visa lite kod så får vi se om vi inte kan lösa det iallafall ;)
NoiseMaker »
Funkar inte detta?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" >
<style type="text/css">
<!--
html, body { height:100%; margin:0; padding:0px; }
-->
</style>
</head>
<body>
<table style="height: 100%; background-color:silver">
<tr>
<td>hej</td>
</tr>
</table>
</body>
</html>