CSS-Problem

Servus miteinand!

Hab mein CSS-Problemchen hier mal aufs Wesentliche reduziert:

Mit dem unten stehendem Quelltext verschachtele ich zwei DIVs.
Funktioniert prima in IE.

Leider sieht´s im FF anders aus.
Was muss ich am style ändern, damit es im FF genauso ausschaut wie im IE ?

//////////////////

TEST

//////////////////

Servus miteinand!

Hab mein CSS-Problemchen hier mal aufs Wesentliche reduziert:

Mit dem unten stehendem Quelltext verschachtele ich zwei DIVs.
Funktioniert prima in IE.

Leider sieht´s im FF anders aus.
Was muss ich am style ändern, damit es im FF genauso ausschaut
wie im IE ?

Es erstmal in einem HTML W3C standard konformen browser erstellen und danach anpassen für sowas wie IE , denn der IE ist der übeltäter der sich aber auch fast in allen sachen nicht richtig verhält. So wie ich, ich schreib fast alles flasch , mann sollte sich also nicht mich als vorbild nehmen , sondern , wenn mann schreiben lernen will , jemand suchen der es kann .

Hallo,

das sind leider etwas zu wenig Informationen um dir da weiter helfen zu können. Tatsache ist, das unterschiedliche Browser (selbst unterschiedliche Versionen des selben Browsers) den selben CSS Code teilweise unterschiedlich verarbeiten und umsetzen.

Mein Vorschlag: Führe dein Problem doch etwas weiter aus (verwendeter Doctype, Browserversionen, …). Es wäre auch nicht schlecht zu wissen, was deine beiden div-Bereiche umschließt und wie sie eingebettet sind.

Gruß Björn

:wink:
Eigentlich kann ich das einigermaßen mit dem HTML-Tippen. Is mein Job seit vielen Jahren.
Und genau: Bei ner Angabe „height:100%;“ kriegt man das Würgen… :smile:

Tja… aber das Layout soll nun mal so aussehen.
Mag sein, dass ich den Beruf verfehlt hab, aber ich krieg das verflixte Ding im FireFox nich in den Griff.

Was ich brauche ist Folgendes:
Ein DIV mit einer dicken Border,
das sich (mit einem bestimmten Abstand oben und unten) über die ganze Höhe des Bildschirm erstreckt
und natürlich beim Skalieren des Fensters nicht kleiner als sein Inhalt wird.

Das lässt sich für IE(8) relativ simpel erzeugen:

/////////////////////////

body {
padding-top: 50px;
padding-bottom: 50px;
}

.mydiv {
border:solid red 20px;
height:100%;
}

Laberrabarber

Laberrabarber

Laberrabarber

Laberrabarber

Laberrabarber

/////////////////////////

Genau so solls auch im FF aussehen.
Oder geht das nicht?

Danke für eure Antworten.
Die Sache tuts jetzt.

Falls mal jemand ein ähnliches exotisches Problemchen haben sollte…
Schöner wärs ja mit DIVs aber es funkt jedenfalls in allen Browsern mit nem guten alten TABLE:

////////////////////////////////////

body {
padding-top: 50px;
padding-bottom: 50px;
}

.border {
border:solid red 20px;
-moz-border-radius:10px;
}

Laberrabarber
Laberrabarber
Laberrabarber
Laberrabarber

Laberrabarber
Laberrabarber
Laberrabarber
Laberrabarber

Laberrabarber
Laberrabarber
Laberrabarber
Laberrabarber

////////////////////////////////////

Doctype ist:

Hallo matsch333,

nicht:

border:solid red 20px;

sondern

border: 20px solid red;

Kleiner, aber feiner Unterschied.

Gruß

osmodius

OT^4: CSS-Problem

Schöner wärs ja mit DIVs aber es funkt jedenfalls in allen
Browsern mit nem guten alten TABLE:

so kann man seine seite natürlich auch versauen :smile:

P.s. es heisst mit dem schlechten alten layout durch tables.

OT^4: CSS-Problem
jetzte weiss ich warum ich immer copy paste vom selfhtml mache :smile: Wegen dem kleinem Unterschied.

Hallo.

nicht:

border:solid red 20px;

sondern

border: 20px solid red;

Kleiner, aber feiner Unterschied.

Nur der Vollständigkeit halber:
Dieser (nicht als Scherz gekennzeichneter) Hinweis ist völliger Unsinn. Die Reihenfolge ist bei Mehrfachangaben zu CSS-Regeln schnurz. Das zusätzliche Leerzeichen ebenfalls.

Selbst die HTML/CSS-Bibel sagt das:
„Notieren Sie Angaben zu Linienstärke, Rahmentyp und Farbe mit Leerzeichen dazwischen (…). Die Reihenfolge der Einzelangaben ist egal.“ (siehe http://de.selfhtml.org/css/eigenschaften/rahmen.htm#…)

Die Sache tuts jetzt.
(…)
Schöner wärs ja mit DIVs aber es funkt jedenfalls in allen
Browsern mit nem guten alten TABLE:

Hallo und „Urks“…

Table ist keine „gute alte“, sondern eine überaus schlechte Idee.

Es spricht alles gegen ein Table, aber nichts gegen ein div:


<?xml version="1.0" ?>BigBox-Test

div#bigbox
{position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
border: 10px solid red;
}

Blabla


Gruß
A.