Tweet
[& HTML] Design aus Div-Tags? Probleme...
Hi,
ich möchte ein neues Design mit Div-Tags (nicht mit Tabellen, was ich sonst immer gemacht habe) erstellen und habe schon ziemlich viele Probleme:[list=1][*]Man kann ja z.B. per Strng & "+" die Schriftgröße in den meisten Browsern verändern. Wenn man das jetzt tut, dann verändert sich aber nicht die größe der Kästen (was ich gerne möchte), sondern nur die Schriftgröße. Es sollte so sein, dass die Kästen sich so verändern, dass das Design nicht auseinander gerissen (aber trotzdem größer) wird (z.B. wie hier). Welche postionierung muss ich dann wählen - denn absolute und relative geht ja nicht...[*]Sobald ich einen Doctype "benutze" (zb. "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">") wird das Design enger, so als ob "padding" nicht mehr akzeptiert wird. Was muss ich ändern?[*]Ich habe gelesen, dass man nicht alles mit Div-Tags gestalten sollte, sondern, dass Text in Absätze kommt, Überschriften deklariert werden und Grafiken speziell angeordnet werden etc. Nur wenn es nötig ist, sollte man Div-Tags benutzen (halt so ein paar, um die Positionen festzulegen).
Aber wie setze ich dass (in meiner Seite) um?[/list=1]
Ich hoffe ihr könnt mir helfen, denn ich bewegen mich da auf absultem Neuland
... Wenn ihr sonst noch was (zB. an der Formatierung des Code`s) kritisieren könnt, dann gerne 
Das Design sollte übrigens auch an diesem hier angepasst sein (Wenn ihr also noch andere Umsetzungsmöglichkeiten wisst, dann sagt sie bitte):
http://tes.ctmworld.net/forum/index.php?
hier der Code meiner Seite (den Avatar bitte nicht beachten...):
gruß Tokuul!
ich möchte ein neues Design mit Div-Tags (nicht mit Tabellen, was ich sonst immer gemacht habe) erstellen und habe schon ziemlich viele Probleme:[list=1][*]Man kann ja z.B. per Strng & "+" die Schriftgröße in den meisten Browsern verändern. Wenn man das jetzt tut, dann verändert sich aber nicht die größe der Kästen (was ich gerne möchte), sondern nur die Schriftgröße. Es sollte so sein, dass die Kästen sich so verändern, dass das Design nicht auseinander gerissen (aber trotzdem größer) wird (z.B. wie hier). Welche postionierung muss ich dann wählen - denn absolute und relative geht ja nicht...[*]Sobald ich einen Doctype "benutze" (zb. "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">") wird das Design enger, so als ob "padding" nicht mehr akzeptiert wird. Was muss ich ändern?[*]Ich habe gelesen, dass man nicht alles mit Div-Tags gestalten sollte, sondern, dass Text in Absätze kommt, Überschriften deklariert werden und Grafiken speziell angeordnet werden etc. Nur wenn es nötig ist, sollte man Div-Tags benutzen (halt so ein paar, um die Positionen festzulegen).
Aber wie setze ich dass (in meiner Seite) um?[/list=1]
Ich hoffe ihr könnt mir helfen, denn ich bewegen mich da auf absultem Neuland
... Wenn ihr sonst noch was (zB. an der Formatierung des Code`s) kritisieren könnt, dann gerne Das Design sollte übrigens auch an diesem hier angepasst sein (Wenn ihr also noch andere Umsetzungsmöglichkeiten wisst, dann sagt sie bitte):
http://tes.ctmworld.net/forum/index.php?
hier der Code meiner Seite (den Avatar bitte nicht beachten...):
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>test</title>
<style type="text/css">
<!--
body { background:#660000; font-size:12px; font-family:Tahoma,Helvetica; color:#000000; text-align: center; }
#main { top:8px; left:8px; width:986px; height:900px; margin-left:auto; margin-right:auto;
background:#8b4513; border:solid 1px #fffac4; text-align:left; z-index:0; }
#pfad { position:relative; top:10px; left:12px; width:954px; height:12px; padding:4;
background:#fffac4; border:solid 1px #000000; text-align:left; z-index:1; }
#time { position:relative; top:9px; left:12px; width:954px; height:12px; padding:4;
background:#fffac4; border:solid 1px #000000; text-align:right; z-index:1; }
#start { position:relative; top:24px; left:12px; width:96px; height:15px; padding:2;
background:#fffac4; border:solid 1px #000000; text-align:center; z-index:1; }
#mnu_start { position:relative; top:23px; left:12px; width:96px; height:46px; padding:2;
background:#fffac4; border:solid 1px #000000; text-align:left; z-index:1; }
#info { position:relative; top:23px; left:12px; width:96px; height:15px; padding:2;
background:#fffac4; border:solid 1px #000000; text-align:center; z-index:1; }
#mnu_info { position:relative; top:22px; left:12px; width:96px; height:46px; padding:2;
background:#fffac4; border:solid 1px #000000; text-align:left; z-index:1; }
#arrow { position:relative; top:-122px; left:113px; width:15px; height:15px; padding:2;
background:#fffac4; border:solid 1px #000000; text-align:left; z-index:1; }
titel {
color:#000000;
font-size:10px;
font-family:Tahoma,Helvetica; }
a.titel {
color:#000000;
font-size:10px;
font-family:Tahoma,Helvetica; }
a.titel:hover {
text-decoration:none;
color:#000000;
font-size:10px;
font-family:Tahoma,Helvetica; }
a.menu {
color:#000000;
font-size:11px;
font-family:Tahoma,Helvetica; }
a.menu:hover {
border: solid 1px #000000;
background-color: #660000;
font-size: 11px;
color: #fffac4; }
</style>
</head><body>
<div id="main"><img src="hp_logo.png" border="0"></img><img src="Tokuul.jpg" border="0"></img>
<div id="pfad"><b><a class="titel" href="news.php">The Elder Scrolls »</a></b></div>
<div id="time"><titel class="titel">Datum | Zeit</titel></div>
<div id="start"><img src="mnu_startseite.png" border="0"></div>
<div id="mnu_start">
» <a class="menu" href="news.php">News</a><br>
» <a class="menu" href="news.php">News Archiv</a><br>
» <a class="menu" href="news.php">News einreichen</a>
</div>
<div id="info"><img src="mnu_information.png" border="0"></div>
<div id="mnu_info">
» <a class="menu" href="news.php">FAQ</a><br>
» <a class="menu" href="news.php">...</a>
</div>
<div id="arrow"><img src="folder.gif" border="0"></div>
</div>
</body></html>
gruß Tokuul!
Kommentar