css problem

Jack9027 · Beitrag von **Jack9027** » 02.02.2005 19:51

hi,
ich hab mir ein ganz einfaches drei spalten layout gemacht:
css:

#header {
    width: 100%;
    float: middle;
    border: dashed 1px #999;
    margin-bottom: 10px;
}

#menu {
    width: 10%;
    float: left;
    border: dashed 1px #999;
    margin-right: 10px;
}

#main {
    width: 88%;
    float: left;
    border: dashed 1px #999;
    margin: 0px;
    overflow: auto;
}

html:

Code: Alles auswählen

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<div xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="./1.css" />
</head>
<body>
<div id="header">
blup
</div>
<div id="menu">
<?php include ("./menu.html"); ?>
</div>
<div id="main">
blup
</div>
</body>
</html>

mein problem ist jetzt, dass wenn ich width für main auf 90% stell menu und main nichtmehr auf der gleichen höhe sind, wenn ich aber main z.b auf 88% stell ist main und menu zusammen nichtmehr genauso breit wie der header. ich hoff mal, dass des einzigermaßen verständlich war, wenn nicht könnte ich auch noch ein paar screenshots posten.
schonmal danke für eure hilfe

Beitrag von **D@ve** » 02.02.2005 21:12

Wie wärs mit einem Link anstatt von Screenshots?

Jack9027 · Beitrag von **Jack9027** » 02.02.2005 21:33

ok habs bloss vorher uploaden müssen. http://www.die-kulturtaschen.de/
das feld wo blup steht geht nicht genauso weit nach rechts wie das oberste feld. also ist die frage wie ich es schaff, dass es auch so weit nach rechts geht wie das oberste.

Beitrag von **D@ve** » 03.02.2005 02:46

Du musst - so wie ich das sehe - entweder den blub-div rechtsbündig ausrichten oder - das wäre wahrscheinlich die bessere und flexiblere variante - zwischen bla-div und blub-div noch ein unsichtares div mit 2% einrichten...

Wenn das eine Menüstruktur werden soll würde ich allerdings...
- dem bla div einen fixen Pixelwert (zB. 250px) zuordnen
- beim unsichtbaren div das gleiche machen (zB. 20px),
- und dem blub-div den rest zurp

Gruß, Dave

Jack9027 · Beitrag von **Jack9027** » 03.02.2005 13:31

D@ve hat geschrieben: - und dem blub-div den rest zurp

hm ok danke, aber in prozent oder px oder was?
und wie würde das mit den rechtsbündig ausrichten gehn, weil text-align richtet ja irgendwie bloss den text aus. außerdem hab ich noch ein problem

mit dem unsichtbaren div, weill wenn ich einfach

Code: Alles auswählen

<div id="spacer"></div>

und

Code: Alles auswählen

#spacer {
	width: 20px;	
}

schreib dann wird des irgendwie ignoriert

Beitrag von **Pyramide** » 03.02.2005 17:42

Versuch mal, zwischen <div> und </div> ein   reinzusetzen

Jack9027 · Beitrag von **Jack9027** » 03.02.2005 18:02

danke des geht schonmal, jetzt gibs bloss noch die zwei anderen fragen

larsneo · Beitrag von **larsneo** » 03.02.2005 18:58

ich hab mir ein ganz einfaches drei spalten layout gemacht:

dynamische css-basierende dreispalter sind in aller regel alles andere als einfach, von daher ein *anschauungs-tipp* von ruthsarian layouts.

Jack9027 · Beitrag von **Jack9027** » 03.02.2005 19:34

hm danke für die zwei links, es wär aber trotzdem nett, wenn noch jemand die zwei fragen beantworten könnte

.

hm ok danke, aber in prozent oder px oder was?
und wie würde das mit den rechtsbündig ausrichten gehn, weil text-align richtet ja irgendwie bloss den text aus.

Beitrag von **D@ve** » 03.02.2005 21:13

Jack9027 hat geschrieben:hm danke für die zwei links, es wär aber trotzdem nett, wenn noch jemand die zwei fragen beantworten könnte .

hm ok danke, aber in prozent oder px oder was?
und wie würde das mit den rechtsbündig ausrichten gehn, weil text-align richtet ja irgendwie bloss den text aus.

Keine Hektik, keine Hektik... Was Pixel/Prozent angeht habe ich Dir oben gesagt wie ich es machen würde:
Links: Pixel, Spacer: Pixel, Hauptseite Prozent

Hmmm um das Rechtsbündig zu machen, müsstest Du glaube ich nochmal nen div um die ganze Konstruktion drum rum bauen... bin mir aber auch nicht sicher, geht das nicht einfach mit align: right?? Habs noch nicht ausprobiert... Ich mach sowas immer ganz altmodisch mit Tabllen

(dafür funktionieren meine Layouts dann auch noch im Netsacpe 4)

Gruß, Dave