Ebenen ausrichten

Blackwalker · 28. November 2007

Hi
Also ich bin grad dabei mich in html und css einzuarbeiten... dabei dient mir ein selbst designtes portfolio...

Allerdings, sind die ebenen jetzt total verschoben...
die ebene die eig. überm context sein sollte, is halb aufm bg... naja ich benutz Dreamwweaver als kleine hilfe, und um zu schaun ab alles kappt was ich da schreib ^^...
naja, da passt halt die ebene drüber, wenn ichs mir jetzt im browser anschau, is sie halt verschoben...
wie schaff ichs, dass sie an der richtige stelle ist, und dass bei jeder auflösung...
hatte schon überlegt die position in % anzugeben, aber dann isses ja bei ner anderen bildschirmauflösung auch wieder verschoben...
und wenn mans in px angibt, isses ja bei ner andern auflösung auch verschoben, weil dann isses ja n anderer abstand zu dem punkt wo die ebene hinsoll

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Portfolio</title>

<style type="text/css">
<!--
#Titelebene {
 position:absolute;
 left:212px;
 top:264px;
 width:42px;
 height:18px;
 z-index:1;
}
.Stil1 {
 font-family: Arial, Helvetica, sans-serif;
 font-weight: bold;
 font-size: 12px;
 color: #5e9e07;
}
#Textebene {
 position:absolute;
 left:188px;
 top:277px;
 width:510px;
 height:368px;
 z-index:2;
 overflow: scroll;
}
.Stil3 {
 font-family: Arial, Helvetica, sans-serif;
 font-weight: bold;
 font-size: 11px;
 color: #5e9e07;
}
.Stil4 {
 color: #315b00
}
.Stil5 {font-family: Arial, Helvetica, sans-serif; font-weight: bold; font-size: 11px; color: #315b00; }
-->
</style>
</head>

<body background="images/bg.gif">
<div class="Stil1" id="Titelebene">Home</div>

<div class="Stil3" id="Textebene">
 <p class="Stil4">L Lorem ipsum dolor sit amet [....] </p>
 <p class="Stil4">Duis autem [....] </p>
 <p class="Stil4">Ut wisi enim[...]</p>
 <p class="Stil4">Nam liber [...] </p>
 <p class="Stil5">&nbsp;</p>
</div>
<table width="782" border="0" align="center" cellpadding="0" cellspacing="0">
 <tr>
 <td height="194" background="images/images/header.png"> </tr>
</table>
<table width="782" height="25" border="0" align="center" cellpadding="0px" cellspacing="0">
 <tr>
 <td width="106" height="25" background="images/images/links.png">
 <td> <a href="home.html"> <img src="images/images/home.png" border="0"></a></td>
 <td> <a href="works.html"> <img src="images/images/works.png" border="0"></a></td>
 <td> <a href="about_me.html"> <img src="images/images/about_me.png" border="0"></a></td>
 <td> <a href="gb.html"> <img src="images/images/gb.png" border="0"></a></td>
 <td width="384" height="25" background="images/images/rechts.png">
 </tr>
</table>
<table width="782" height="460" border="0" align="center" cellpadding="0px" cellspacing="0">
 <tr>
 <td width="782" height="460" background="images/images/content.png"">
 </tr>
</table>
<table width="782" border="0" align="center" cellpadding="0px" cellspacing="0">
 <tr>
 <td width="782" height="77" background="images/images/footer.png">
 </tr>
</table>
</body>
</html>

hoffe ihr kloppt mich jetzt nich...
ich weiß nich wie ich das lösen kann... n kumbel hatte irgendwie gemeint ich sollte die komplette seite in n div machen... naja der is aber gestern in urlaub gefahrn... wär klasse wenn ihr mir helfen könntet

mfg Bw

Anzeige

MakenX · 28. November 2007

AW: Ebenen ausrichten

Guten Abend,

also zwei Dinge empfehle ich dir bevor ich irgendwas anderes sage ..

1. Keine Tabellen für Designs
2. http://validator.w3.org

So die zwei Vorschläge befolgen und aus den Fehlern lernen. HTML ist nicht schwer und das Internet bietet bereits zig Millionen Hilfestellungen zu Probleme wie du sie hast.

PS: Ich persönlich brauch in einem von 1000 Fällen position: absolute;

av-p · 29. November 2007

AW: Ebenen ausrichten

Schau mal in die SelfHTML, was da unter "div" steht. Dasmit solltest Du die Formatierung machen, nicht mit Tabellen. Du kannst einem div auch eine minimale und maximale Breite geben, an die er sich anpasst, so dass Dein Design bei (fast) jeder Auflösung gleich aussieht.
kannst Du hier mal anschauen. Ist nur ein Testprojekt, aber mit divs. Mach mal Deinen Browser seitlich kleiner und Du siehst den Effekt.
Und nochwas: Binde wenn möglich die css nur ein, nicht in jeder html neuschreiben. so musst Du sie nur einmal ändern, Wenn Du ein großes Projekt hast, artet das sonst in Arbeit aus.

latitude · 29. November 2007

AW: Ebenen ausrichten

Hi,

position:absolute; wird Dich sicherlich einige Nerven kosten. Bedenke, dass Deine Seite nicht nur in einem Browser gut aussehen sollte. Wir testen alle unserer Projekte in IE 6, IE7, Firefox, Opera sowie Safari. Du wirst schnell sehen, dass position:absolute; hier Probleme verursacht.

Für die ersten Schritte findest Du auch hier gute Hilfe:

CSS 4 You - The Finest in Stylesheets

Greetz

Blackwalker · 29. November 2007

AW: Ebenen ausrichten

danke schonmal

könnt ihr mir sagen warum ich kine tabellen benutzen sollte? dachte dass wär die einfachste möglichkeit des iwie in ne gescheite position zu bringen...

MakenX · 29. November 2007

AW: Ebenen ausrichten

Mit dieser Antwort hast du gezeigt dass du dir die Tipps nocht nicht zu Herzen genommen hast, denn zum Einen kann man die Nachteile von Tabellen mehrfach im Netz nachlesen und Zum Anderen könnte man sich den Sinn hinter Tabellen auch selber erschließen. Tabellen sind zur tabellalarischen Darstellung von Daten und gehören im Webdesign _eigentlich_ schon lange verbannt .... einfacher als ordentliche Semantik auch nicht unbedingt.

Blackwalker · 29. November 2007

AW: Ebenen ausrichten

ja hast recht, ich hate mir des noch nich alles durchgelesn...
weil ich erst wissenwollte warum ich alles nochma neu machen soll, obwohl es ja geht...
also
danke für die hilfe
mfg Bw

Nützliche Suchen

Ebenen ausrichten

Videos zum Themenbereich