webForumDet fria alternativet

Relativ tabell/cell-höjd

3 svar · 309 visningar · startad av m_soderlund

m_soderlundMedlem sedan sep. 20026 425 inlägg
#1

Jag blir helt galen på detta. Jag skapar några tabeller och bestämmer
deras höjd. En tabell i en cell (låt oss kalla cellen för kantcell)
bredvid huvudcellen där allt innehåll
ska visas, ska naturligtvis ha en relativ höjd på exempelvis 100%. Beroende
på hur mycket innehåll det är i innehållscellen så ska kantcellens höjd alltid
anpassas efter innehållscellens höjd - vilket nu cellen i min kod ej gör.

Om jag använder absolut höjd med px så fungerar det naturligtvis - men i så fall
är innehållescellen begränsad till en specifik höjd för att designen ska vara
estetiskt tilltalande.

Alltså - koden som jag markerat med rött vill jag ska anpassas efter innehållscellens obestämda höjd som varierar beroende på text/infomängden. Den första koden i rött motsvarar den vänstra kanten på sidan som är 70px hög, den andra koden i rött motsvarar den högra sidans kant som är 100%.

Jag har försökt med annan XHTML, CSS och allt möjligt. :(
Sidan kan skådas här: https://www.dileno.hel.nu/temp/tbl/tabellproblem.asp

Koden:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

<title>Dileno</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link rel="stylesheet" type="text/css" href="style.css" />
<script language="javascript" type="text/javascript" src="scriptlib.js">
</script>

</head>

<body>

<table cellpadding="4" cellspacing="2" border="0" width="700px" align="center">
<tr>
<td valign="top" align="left">

<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td>

[red]<table cellpadding="0" cellspacing="0" border="0" width="13px">
<tr>
<td width="2px" height="70px" bgcolor="#82929C"></td>
<td width="1px" height="70px" bgcolor="#1D333F"></td>
<td width="5px" height="70px" bgcolor="#455B67"></td>
<td width="1px" height="70px" bgcolor="#1D333F"></td>
<td width="2px" height="70px" bgcolor="#82929C"></td>
<td width="2px" height="70px" bgcolor="#1D333F"></td>
</tr>
</table>[/red]

</td>

<td valign="top" width="100%">

<table cellpadding="0" cellspacing="12" border="0" width="100%" class="main">
<tr>
<td valign="top">
Här är en massa text, en massa text.
<br />
<br />Här kommer ännu mer text, en massa text.
</td>
</tr>
</table>

<td>

[red]<table cellpadding="0" cellspacing="0" border="0" width="13px">
<tr>
<td width="2px" height="100%" bgcolor="#1D333F"></td>
<td width="2px" height="100%" bgcolor="#82929C"></td>
<td width="1px" height="100%" bgcolor="#1D333F"></td>
<td width="5px" height="100%" bgcolor="#455B67"></td>
<td width="1px" height="100%" bgcolor="#1D333F"></td>
<td width="2px" height="100%" bgcolor="#82929C"></td>
</tr>
</table>[/red]

</td>
</tr>
</table>

</td>
</tr>
</table>

</body>
</html>

OERHÖRT TACKSAM för hjälp.

PepeJeriaMedlem sedan feb. 2003774 inlägg
#2

Rekommenderar att du validerar din kod på w3c för att hitta felen.
när du anger en width så ska du inte ha "px" med tex. Sen att ha height:100%; i varje td är också lite tokigt.

jarvkloMedlem sedan juli 20013 378 inlägg
#3

Är det något i den här stilen du är ute efter ;)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Moddad Dileno-tabell</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>

<table cellpadding="0" cellspacing="0" border="0" width="700">
<tr>
<td width="2" bgcolor="#82929C"></td>
<td width="1" bgcolor="#1D333F"></td>
<td width="5" bgcolor="#455B67"></td>
<td width="1" bgcolor="#1D333F"></td>
<td width="2" bgcolor="#82929C"></td>
<td width="2" bgcolor="#1D333F"></td>
<td width="674"> <!-- 700-13-13 -->
<table cellpadding="0" cellspacing="12" border="0" width="100%" class="main">
<tr>
<td valign="top">
Här är en massa text, en massa text.
<br />
<br />Här kommer ännu mer text, en massa text.
</td>
</tr>
</table>
</td>
<td width="2" bgcolor="#1D333F"></td>
<td width="2" bgcolor="#82929C"></td>
<td width="1" bgcolor="#1D333F"></td>
<td width="5" bgcolor="#455B67"></td>
<td width="1" bgcolor="#1D333F"></td>
<td width="2" bgcolor="#82929C"></td>
</tr>
</table>

</body>
</html>
m_soderlundMedlem sedan sep. 20026 425 inlägg
#4

Enkelhet framför allt. Jarvklo rockar! Tack!

136 ms totalt · 3 externa anrop · v20260731065814-full.30151723
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
134 ms — hämta tråd, inlägg och bilagor (db)