[CSS] Browser und Darstellung *erledigt*

[justme69]

ich flippe aus...

Ich muß eine Site überarbeiten und will die Darstellung erstmal korrekt anpassen.

D.h. valides CSS etc... Hmpf

Testseite: https://62.245.151.236/devi2/Test.php

Das Problem ? Schaut's euch einmal im Opera, im Mozialla und IE an...
Die Darstellung IE ist die Gewünschte....

Das CSS dazu:

body, body.Start
{
	margin: 0px;
	font-size: small;
	color: #AAAAAA;
	background-color: #000024;
	z-index: 1;
	margin: 0px;
	height: 100%;
	width: 100%;
	display: block;
	line-height: normal;
	border: 0px;
	background-image: url(../Images/BG_Navi.jpg);
	background-position: bottom left;
	background-repeat: no-repeat;
}

#Head
{
	position: absolute;
	left: 22%;
	top: 3%;
	height: 54px;
	width: 77%;
	background-color: transparent;
	background-image: URL(../Images/NaviBG3.jpg);
	background-position: top left;
	background-repeat: repeat-x;
	z-index: 3;
	visibility: visible;
	border: 0px;
	margin: 0px;
}

#Menue
{
	position: absolute;
	left: 0px;
	top: 54px;
	width: 22%;
	padding-top: 1%;
	background-color: transparent;
	text-align: right;
	z-index: 1;
	visibility: visible;
	border: 0px;
	float: none;
}

#Inhalt
{
	position: relative;
        left: 22%;
	top: 100px;
	width: 68%;
	margin-left: 10px;
	padding-left: 1%;
	padding-top: 10px;
	background-color: #555555;
        color: White;
	background-image: url(../Images/EdgeLT.jpg);
	background-repeat: no-repeat;
	background-position: top left;
	z-index: 1;
	visibility: visible;
	border: 0px;
	line-height: normal;
	float: none;
}

#Footer
{
	position: relative;
	height: 20px;
	width: 68%;
	left: 22%;
	margin-left: 10px;
	padding-left: 1%;
	top: 100px;
	color: White;
	background-color: #333333;
	background-image: url(../Images/EdgeLB.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
	margin-left: 10px;
	z-index: 2;
	visibility: visible;
	border: 0px;
	line-height: normal;
	float: none;
}

#Dekor1
{
	position: absolute;
	top: 0px;
	left: 97%;
	width: 1%;
	height: 100%;
	background-color: #092941;
	z-index: 2;	
	visibility: visible;
	border: 0px;
}

#Dekor2
{
	position:absolute;
	top: 0px;
	left: 93%;
	width: 3%;
	height: 100%;
	background-color: #031E33;
	z-index: 2;
	visibility: visible;
	border: 0px;
}

h4.Header
{
	font-family: verdana, geneva, arial, helvetica, sans-serif;
	font-size: xx-small;
	font-weight: normal;
	color: #777777;
	margin: 0px;
	padding-right: 10%;
	padding-top: 5px;
}

h2
{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: medium;
	font-weight: bolder;
	letter-spacing: 3pt;
	color: #BEBEBE;
	margin: 0px;
	padding-top: 22px;
	padding-bottom: 5px;
	padding-left: 0px;
	padding-right: 10%;
	border-bottom: 1px dashed #555555;
}

Validator sagt zum CSS OK.

Problembereiche: Abstand #Inhalt und #Footer / linke Grafik nicht links unten / Im Opera horizontale Scrolleiste vorhanden
Die Grafik für links unten ist als Hintergrundgrafik im body definiert.

Ich verzweifle noch ...
Hilfe..

 

[ABC]

** No Fullquote edit by theHacker **

Der Fifo Opera und Netscape sind nicht in der Lage margin Attribute zu berechnen. Ebenso padding. Der IE rechnet das Margin Attrinbut korrekt nach aussen, während die anderen 3 diese hinzurechnen, was zar Gedanklich in erster Linie WD3C technisch i.o. ist, CSS aber eine MS Sache ist. Margin wurde gedacht um Abstand nach aussen von anderen Objekten zu halten.

ne 800px Tabelle mit einem margin von 3px, sollte 796 Pixel Breit sein. Bei IE ist das so. Beim Fifo macht das 806 Pixel, schon daher kommt der Unterschied. Das macht im Beispiel satte 12 Pixel. Aber du kannst dir Anhilfe schaffen, indem du den Padding auf selbigen Wert des Margins stellst.

 

[justme69]

du kannst dir Anhilfe schaffen, indem du den Padding auf selbigen Wert des Margins stellst.

Das bringt aber nicht wirklich was. habe beim #Inhalt und #Footer margin entfernt - der #Inhalt rutscht jetzt nur näher an #Menue ran - sonst bleibt's beim Alten

 

[Moloc]

Abstand #Inhalt und #Footer

Folgender Code sollte funktionieren: (der abstand kommt von dem letzen p-element)

#Inhalt p { margin-bottom: 0px;}

linke Grafik nicht links unten

Löst der folgende code das problem?

	background-attachment: fixed;

Im Opera horizontale Scrolleiste vorhanden

eventuell opera bug (in opera9 beta ist das nicht mehr vorhanden) lösche im CSS die "width: 100%" Angabe im body heraus, dann sollte die scrollbar verschwinden (warum definierst du css angaben für "body, body.Start"? Alles was für "body" gültig ist, ist auch für "body.Start" gültig.)

PS: im IE lässt es sich bei mir nur bis zu inhalt 13 scrollen... (den rest bekomm ich da nicht zu gesicht)

 

[Graccem]

** No Fullquote edit by theHacker **

Der Fifo Opera und Netscape sind nicht in der Lage margin Attribute zu berechnen. Ebenso padding. Der IE rechnet das Margin Attrinbut korrekt nach aussen, während die anderen 3 diese hinzurechnen, was zar Gedanklich in erster Linie WD3C technisch i.o. ist, CSS aber eine MS Sache ist. Margin wurde gedacht um Abstand nach aussen von anderen Objekten zu halten.

ne 800px Tabelle mit einem margin von 3px, sollte 796 Pixel Breit sein. Bei IE ist das so. Beim Fifo macht das 806 Pixel, schon daher kommt der Unterschied. Das macht im Beispiel satte 12 Pixel. Aber du kannst dir Anhilfe schaffen, indem du den Padding auf selbigen Wert des Margins stellst.

FF und Opera machen das schon richtig. Wenn man dem IE nicht in den Quirksmodus schickt, dann stellt er die Abstände ebenso wie FF und Opera dar.

 

[justme69]

Danke !

Folgender Code sollte funktionieren: (der abstand kommt von dem letzen p-element)

#Inhalt p { margin-bottom: 0px;}

Löst der folgende code das problem?

	background-attachment: fixed;

eventuell opera bug (in opera9 beta ist das nicht mehr vorhanden) lösche im CSS die "width: 100%" Angabe im body heraus, dann sollte die scrollbar verschwinden

Das funktioniert 100%ig GEIL !
Ich freu mich, danke
Kleine Lose-Spende kommt - wenn ich deine KlammID erfahre

(warum definierst du css angaben für "body, body.Start"? Alles was für "body" gültig ist, ist auch für "body.Start" gültig.)

PS: im IE lässt es sich bei mir nur bis zu inhalt 13 scrollen... (den rest bekomm ich da nicht zu gesicht)

Weil noch weitere Styles natürlich kommen
Werd ich mir mit demm IE noch genauer anschauen - evtl arbeite ich mit overflow

 

[Tattooman]

Nur mal ne doofe frage! Warum gehts ab Zeile 55 Los ??

 

[justme69]

Nur mal ne doofe frage! Warum gehts ab Zeile 55 Los ??

Was geht ab 55 los