2 Divs in einer Reihe (menu und Content)

[d3mueller]

Hi, danke
habe das hier benutzt, um so eine sidebar und einen Contentbereich zu machen.
http://fwpf-webdesign.de/files/upload/02_2-spalter_header+footer.htm#
(halt ohne header und Footer).

Ein Problem habe ich jetzt noch damit:

Wenn ich im Content-Bereich den Inhalt mit padding-top verschieben möchte (oder ein <br> ganz nach oben im Content-Bereich setze), dann verschiebt sich die Sidebar nach oben.
Die Screens sind vom Firefox. alle anderen Browser verhalten sich zwar genauso, aber die Sidebar ist um einige pixel nach unten verschoben, was auch blöd ist.
Weiss einer, woran das liegen kann?





Mein CSS:

#wrap {
	margin-left: 10%;
	margin-right:30%;
	margin-top: 8px;
}
 
#sidebar {
	background-image: url('../Bilder/Seite-head-menu.png');
	background-repeat: repeat-x;
	background-color: #eee;
	width: 10em;
	float:left;
	height: 700px;
	overflow: hidden;
	padding-left: 2%;
	padding-right: 2%;
	-moz-box-shadow: 0px 0px 40px -10px #333;
	-webkit-box-shadow:  0px 0px 40px -10px #333;
	box-shadow: 0px 0px 40px -10px #333;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-moz-border-radius-bottomright: 10px;
	-moz-border-radius-bottomleft: 10px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
}
 
#content {
	padding-left: 240px;
	padding-right: 20px;
	text-align: justify;
	color: #fff;
	font-family: "Arial";
	font-weight: bold;
	min-width: 600px;
}

(Für den IE ist es leicht abgeändert, aber im Prinzip genauso).


Danke schon mal

LG


PS: Weiß einer vllt auch noch, wie man das ganze mittig setzen kann? Bei mir ist es relativ weit links

 

[Myhar]

AW: 2 Divs in einer Reihe (menu und Content)

Ein CSS ist ohne das dazugehöroge HTML nutzlos. So kann man dir nur raten: Nimm Firebug und analysiere den Fehler selbst.
Bezüglich des zentrieren kann ich dir diesen Link wärmstens ans Herz legen.

 

[d3mueller]

AW: 2 Divs in einer Reihe (menu und Content)

Das HTML ist wie im Link oben...

<div id="wrap">
<div id="main">
<div id="sidebar">
.......
</div>
<div id="content">
.............
</div>
</div>
</div>

Zu firebug: ich benutze leider Chrome und da kann Firebug keine lokalen Dateien prüfen.

Mit dem zentrieren: Ich weiß, wie man mit CSS zentriert. Aber hier funktioniert das halt nicht, weil ich mit margin-left und margin-right arbeite. Deswegen frage ich ja hier

 

[Myhar]

AW: 2 Divs in einer Reihe (menu und Content)

Chrome ist ja genauso gut, da ist "Firebug" bereits integriert. Rechtsklick und Element untersuchen wählen, dann hast du das Webdeveloper Tool von Chrome. Spätestens zum Testen deiner Website wirst du dir wohl Firefox, Opera und IE Versionen installieren müssen.

Aber wie willst du das zentrieren, wenn du von rechts 30% Abstand haben willst? Das widerspricht sich doch?

 

[d3mueller]

AW: 2 Divs in einer Reihe (menu und Content)

Irgendwie hast du recht xD. Merk auch gerade das das dämlich ist.
Okay, danke, dann schau ich mal^^

 

[d3mueller]

AW: 2 Divs in einer Reihe (menu und Content)

Das Problem ist, ich finde immer noch keinen Fehler, warum sich die Sidebar verschiebt

 

[Hanskrampf]

AW: 2 Divs in einer Reihe (menu und Content)

Dass alle Browser sich anders verhalten liegt daran, dass du keinen CSS Reset mit eingebaut hast und deswegen jeder Browser mit seiner Standardeinstellung arbeitet, sofern du bestimmte Werte in deinem CSS nicht überschrieben hast.

In die Mitte bekommst du die ganze Seite, wenn du dem Wrapper (alles umschließendes Div) im CSS die Eigenschaft "margin: 0 auto;" gibst.

Dass sich die Navigation verschiebt, schiebe ich mal auf dein wildes durcheinanderwerfen von Pixel-, Prozent- und Em-Angaben.