PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : design mit blinden tabellen



supersucker
12-08-2005, 17:37
hallo,

ich hab ein paar fragen die für einen html-profi wahrscheinlich einen witz darstellen...:-)

hab folgende sehr einfache seite (hab alles für die fragen nicht wichtige rausgenommen):




<html>
<head>

</head>

<body>
<table border="0" width=100%>
<colgroup>
<col width="15%">
<col>
</colgroup>
<tr>
<td class="navigation" align="center">

<p><a href="index.html">Home</a></p>
<p><a href="profil.html">Profil</a></p>
<p><a href="seviceandproducts.html">Service&Products</a></p>
<p><a href="referenzen.html">Referenzen</a></p> <p><a href="jobs.html">Jobs</a></p> <p><a href="kontakt.html">Kontakt</a></p>

</td>
<td class="content">
<p>
Home
</p>
</td>
</tr>

</table>

</body>

</html>





hier meine CSS:




body { color:#FFCC99; }
a:link { color:#FFCC99; text-decoration:none }
a:visited { color:#FFCC99; text-decoration:none }
a:active { color:#FFCC99; text-decoration:none}

td.logo {background-color:white}

td.identity h2 { text-align:center}
td.identity {background-color:white}
td.identity {background-image:url(../pics/logo_ohne_inf.jpg);
margin:0px; padding:40px;
background-repeat:no-repeat;
background-position:center}


/* 2.c) navigation */


td.navigation { background-color:#0066AA}
td.navigation { margin-top:50px}


/* 2.d) content */


td.content {background-color:gray}

td.content p { margin-left:30px}





hab also einfach eine blinde tabelle mit zwei spalten, in der linken die navigation, in der rechten der content. nun hab ich folgende probleme, die auch durch längeres stöbern in selfhtml nicht lösen konnte:

1. die beiden spalten sind ja andersfarbig, die linke ist blau, die rechte grau und der hintergrund der gesamten homepage ist weiss. obwohl ich nun in der tabellen-definition den rahmen mit border=0 explizit auf 0 gesetzt, gibt es trotzdem zwischen den beiden spalten einen weissen streifen...
auch der linke und der rechte rand der tabelle haben einen weissen streifen von der hintergrundfarbe...


was läuft da schief, wie kann ich die beiden spalten nahtlos aneinanderfügen und dafür sorgen das auch links und rechts die tabelle bis zum rand geht?
und warum tut border=0 nicht das was es soll?

2. wenn ich der rechten spalte, also der content-spalte sehr viel drinstehen hab, dann rutscht meine navigation immer weiter nach unten, da die zellen ja länger werden.

wie schaffe ich es das die navigationslinks immer an der gleichen stelle fixiert bleiben und nicht nach unten rutschen wenn beide spalten länger werden?

3. wenn im content-bereich nur wenig steht, dann nimmt die tabelle nicht die ganze seite ein, und unter der tabelle wird wieder der seitenhintergrund gezeigt.

wie schaffe ich es das die spalten immer bis zum ende der seite gehen, egal wieviel in den spalten drinsteht?

danke für eure hilfe......

michael.sprick
12-08-2005, 18:44
sowas lässt sich viel schöner mit div-containern als mit Tabellen lösen, aber wenn Du bei Deinem Layout bleiben willst, dann musst Du

zu 1)
dem <table> Tag die Attribute: cellpadding="0" und cellspacing="0" hinzufügen

zu 2)
im Stylesheet das vertical-align setzen:



td.navigation { background-color:#0066AA; vertical-align:top}
td.content {background-color:gray; vertical-align:top}



und zu 3)

im <table> Tag das Attribut height="100%" setzen...