5 svar · 317 visningar · startad av voigtann1
Har försökt att lära mig HTML 4.01... känns som man är tillbaka från början :e problemet är att jag brukar köra
<table height='100%'>
men det fungera ju inte i 4.01 så jag försökte köra:
<table style='height:100%'>
Vilket inte gav det resultat jag ville.. så jag la in
<body style='height:100%'>
Vilket ger nästan det resultat jag vill.. förutom att tabellen hamnar i mitten av hela sidan... har försökt med
vertical-align:top;
i både body taggen och table taggen.. hur gör man?
Fungerar inte Jarvklos förslag i denna fråden?: http://www.webforum.nu/showthread.php?s=&postid=935560#post935560
tyvärr inte... eller du menar att jag inte ska köra tabeller?
Klart du kan köra tabeller - även om MSIE "manglar till" raders och kolumners inbördes mått emellanåt - men det är en helt annan historia ;)
Men ingen kod - inga bra svar du vet ;)
Visa koden - klappklappklapp
Visa koden - klappklappklapp
Visa koden - klappklappklapp
:bire
HTML kod
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>V.Panel</title>
<link href="style.css" rel="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<!-- #include file="scripts/decodes.asp" -->
<body>
<table style='width:100%;height:100%' border='0' cellspacing='0' cellpadding='2'>
<tr>
<td style='width:50px;background:#eeeeee;height:100%'> </td>
<td>
<table style='width:100%;height:100%' border='0' cellspacing='0' cellpadding='6'>
<tr>
<td style='height:78px;width:279px'><img src='images/logo.gif' width='279' height='78' alt='V.Panel'></td>
<td style='width:100%'><%menu() : response.write space(10)%></td>
</tr>
<tr>
<td valign='top' style='height:100%' colspan='2'>
<table>
<tr>
<td><% mainpage()%></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td style='width:50px;background:#EEEEEE'></td>
</tr>
</table>
<table style='width:100%;' border='0' cellspacing='0' cellpadding='2'>
<tr>
<td style='width:50px;background:#eeeeee;height:100%'> </td>
<td>
<table style='width:100%'>
<tr>
<td>
<a href="http://validator.w3.org/check/referer"><img src="http://www.w3.org/Icons/valid-html401" width="88" height="31" alt="Valid HTML 4.01!" style="border:0"></a>
<a href="http://jigsaw.w3.org/css-validator/"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!"></a>
<img src="msWindowsServer2003.gif" alt="Microsoft Windows 2003 Server">
</td>
<td align='right'>Copyright © v.panel 2003 All Rights reserved.</td>
</tr>
</table>
</td>
<td style='width:50px;background:#eeeeee;height:100%'> </td>
</tr>
</table>
</body>
</html>
och css
html, body {
height:100%;
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
background:#ffffff;
color:#333333;
margin:0px 0px 0px 0px;
}
a {
color: #333333;
}
HR {
position:absolute;
}
UL {
margin:0px 0px 0px 20px;
}
.TblBody {
padding-top:7px;
padding-left:7px;
padding-bottom:13px;
padding-right:7px;
color:#000000;
}
td{
font-family: Arial, Helvetica, sans-serif;
font-size: 9pt;
}
Hmm..
Gissar jag rätt när jag gissar att det är något liknande det här du är ute efter ?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>V.Panel - I princip</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
html, body {height:100%;margin:0; padding:0;}
-->
</style>
</head>
<body>
<table style='height:100%;width:100%' border='0' cellspacing='0' cellpadding='0'>
<tr style="vertical-align:top">
<td style='width:50px;background:#eeeeee;' rowspan="2">&nbsp;</td>
<td>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="vertical-align:top">
<td style='height:78px;width:279px'><img src='images/logo.gif' width='279' height='78' alt='V.Panel'></td>
<td>menu() : response.write space(10)</td>
</tr>
</table>
<div style="margin:2px">
mainpage()
</div>
</td>
<td style='width:50px;background:#eeeeee;' rowspan="2">&nbsp;</td>
</tr>
<tr style="vertical-align:bottom">
<td>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="vertical-align:top">
<td style="white-space:nowrap">
<a href="http://validator.w3.org/check/referer"><img src="http://www.w3.org/Icons/valid-html401" width="88" height="31" alt="Valid HTML 4.01!" style="border:0"></a>
<a href="http://jigsaw.w3.org/css-validator/"><img style="border:0;width:88px;height:31px" src="http://jigsaw.w3.org/css-validator/images/vcss" alt="Valid CSS!"></a>
<img src="msWindowsServer2003.gif" alt="Microsoft Windows 2003 Server">
</td>
<td align='right'>Copyright © v.panel 2003 All Rights reserved.</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Man kan alltså inte lita på att höjder i tabeller som har både absoluta och relativa höjdmått i olika rader verkligen blir som man tänkt sig.
Så i koden ovan har du en "strukturtabell" med två rader som definierar dina marginalceller (med rowspan) och en "övre" cell för meny + innehåll samt en "undre" för sidfoten.
Genom att köra valign="top" i övre cellen (+ en separat tabell för logo och meny) samtidigt som du kör valign="bottom" på den undre (också där med en separat tabell för sidfoten) funkar detta ändå så länge du varken har border på strukturtabellen, och så länge du har samma bakgrundsfärg på övre och undre cellen i strukturtabellen så funkar det! ;)
Hackelihack - men det funkar som sagt (om man nu väljer att köra med tabeller för layout och en <!DOCTYPE som ger "strict" mode samtidigt ;) )