Seite 1 von 2

css problem

Verfasst: 02.02.2005 19:51
von Jack9027
hi,
ich hab mir ein ganz einfaches drei spalten layout gemacht:
css:

Code: Alles auswählen

#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

Verfasst: 02.02.2005 21:12
von D@ve
Wie wärs mit einem Link anstatt von Screenshots?

Verfasst: 02.02.2005 21:33
von Jack9027
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.

Verfasst: 03.02.2005 02:46
von D@ve
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

Verfasst: 03.02.2005 13:31
von Jack9027
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 :oops: 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

Verfasst: 03.02.2005 17:42
von Pyramide
Versuch mal, zwischen <div> und </div> ein &nbsp; reinzusetzen

Verfasst: 03.02.2005 18:02
von Jack9027
danke des geht schonmal, jetzt gibs bloss noch die zwei anderen fragen :D

Verfasst: 03.02.2005 18:58
von larsneo
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.

Verfasst: 03.02.2005 19:34
von Jack9027
hm danke für die zwei links, es wär aber trotzdem nett, wenn noch jemand die zwei fragen beantworten könnte :wink: .

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.

Verfasst: 03.02.2005 21:13
von D@ve
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 :wink: .

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 :D (dafür funktionieren meine Layouts dann auch noch im Netsacpe 4)

Gruß, Dave