✔ IE nimmt CSS nicht an

  • Themenstarter Themenstarter Gast170816
  • Beginndatum Beginndatum
G

Gast170816

Hallo, ich benötige mal nen klitzekleinen Hinweis...bei mir ist alles valide, dennoch wird ausschließlich in allen IEs ein Div einfach zugeschoben... also die Nachfolgenden schieben sich nach oben drüber.

Mein Div hat eine Class (weil es woanders ohne Klasse nochmal anders angeordnet wird)
HTML: 
<div id="sideOne" class="topCont">

Und die CSS-Anweisung dazu:
Code: 
#sideOne.topCont  {
width: 780px;
clear: both;
margin: 0px;
padding: 0px;
}

IE nimmt den CSS-Code so nicht (alle anderen machens). Dabei ist alles richtig.. zumindest, wenn ich dem Div mal ne andere ID gebe und es nur über die ID anspreche.
Aber mit Klasse gehts eben nicht.

Vielleicht habe ich irgendnenSchreibfehler, dabei hab ich die Schreibmöglichkeiten Klasse-ID in der CSS schon mehrmals umher gedreht.
 
Moin,

deinen CSS-Schnipsel nimmt die IE-Familie bei mir sehr wohl an.

Vielleicht solltest du mal den Link zu deiner Seite nennen, oder uns einen tieferen Einblick in deinen Code gewähren, um der Ursache des vermeintlichen Problems auf den Grund gehen zu können.

Fantasmo hat gesagt.:
bei mir ist alles valide [...]

Mein Div hat eine Class (weil es woanders ohne Klasse nochmal anders angeordnet wird)
HTML: 
<div id="sideOne" class="topCont">
Zum Vergrößern anklicken....
Klingt so, wie wenn im Markup ein weiteres DIV mit dem ID-Bezeichner #sideOne existiert, was dann keineswegs valide ist.
The W3C Markup Validation Service hat gesagt.:
Error Line **, Column **: ID "sideOne" already defined

An "id" is a unique identifier. Each time this attribute is used in a document it must have a different value. If you are using this attribute as a hook for style sheets it may be more appropriate to use classes (which group elements) than id (which are used to identify exactly one element).
Zum Vergrößern anklicken....

mfg Maik
 
Hallo,
nein es ist tatsächlich valide (HTML & CSS)

Hier der komplette Content-Bereich wo die ganze Sache abläuft
HTML: 
<div id="content">
                
                    	<h2>Headline</h2>

			<div id="sideOne" class="topCont">
			</div> <!--sideOne-->

                        <div id="mainContent" class="topCont">
			</div> <!--mainContent-->

			<div class="clearfloat">
                    	</div>

 </div> <!--content-->


Hier die CSS, wo was mit "sideOne" und "mainContent" passiert:

Code: 
#content {
background-color:transparent;
margin-top:50px;
padding-left:20px;
}

#sideOne {
margin: 0 0 0 30px;
width: 230px;
float: right;
}

#mainContent{
margin: 0px;
float: left;
width: 520px;
position: relative;
}

#sideOne.topCont {
width: 780px;
margin: 0px;
padding: 0px;
clear: both;
}

#mainContent.topCont{
width: 780px;
clear: both;
}

"sideOne" ist mit der Klasse nämlich quer und ohne -an anderer- Stelle eine Spalte.

Ich habe gemerkt, wenn ich "sideOne" z.B. nur so benenne <div class="topCont"> dann gings, aber sobald ich #sideOne.topCont in der CSS (und halt noch ID in HTML) geschrieben habe, wars wieder zugeschoben.
 
Eines vorweg: Das Problem existiert grundsätzlich nicht nur im IE, wenn ich deine Code-Fragmente browserübergreifend betrachte.

Fantasmo hat gesagt.:
Ich habe gemerkt, wenn ich "sideOne" z.B. nur so benenne <div class="topCont"> dann gings, aber sobald ich #sideOne.topCont in der CSS (und halt noch ID in HTML) geschrieben habe, wars wieder zugeschoben.
Zum Vergrößern anklicken....
Kein Wunder, gilt doch der erste ID-Selektor #sideOne hier ebenso für diesen DIV-Block, und die darin gesetzten Werte für die margin- und width-Eigenschaft werden vom nachfolgenden Regelblock im Selektor #sideOne.topCont überschrieben, die Regelangabe float:right besitzt aber weiterhin Gültigkeit, womit der Block vom Browser aus dem normalen Textfluß genommen wird. Dein Versuch, dem mit clear:both entgegenzuwirken, nützt da recht wenig.

Die Regel müsste demnach so lauten:
CSS: 
#sideOne.topCont {
width: 780px;
margin: 0;
padding: 0;
float: none;
}

mfg Maik
 
Ok, also

Code: 
float: none;

ist hier der Trick.

Das is ja n Ding, das wusst ich gar nicht, denn ich dachte, das würde eben wie gewohnt problemlos überschrieben und eben der Validator hat bei der CSS auch gesagt "null Fehler"(...Ok, aber der kannte vermutlich nicht meine Zusammenhänge, wie ich das Element letztich verwende).
"float: none" hatte ich beim Googeln auch irgendwo gesehen. Hatte aber irgendwas gelesen von "...wenn das floating nicht aufgehoben werden soll" ...deshalb hab ich dem keine Beachtung weiter geschenkt. Vielleicht hab ich da aber doch ein bisschen schief gelesen:-(.

Vielen Dank jedenfalls, da hab ich ja mal wieder was dazugelernt!
 
Jetzt wollt ich schon sagen:

"Na, dass es erst "right" hieß und dann eben "clear"...."

Aber stimmt, "right" steht ja bei "float" und "clear" überschreibt ja dann nicht "float"... das kann nur "float: none". Ähäm...
 
Hab mal ne Frage:

Warum sind dessen CSS Notationen mit Grossbuchstaben versehen?

Macht das irgendwie einen näheren Sinn oder ist das nur Willkür - also ich für meinen Teil schreibe meine CSS Notation immer klein - nicht dass ich jetzt irgendeinen neuen Trend verpasst hab, frag ich lieber nach.

Gruss thecamillo

PS: Wo kann ich eigentlich nochmal ein Weblayout - Entwurf bewerten lassen, der bereits online verfügbar ist?
 
Die Homepage Reviews Forum ist ja eigentlich nur für fertige Internetseiten und bei mir steht erst nur die Startseite. Allerdings habe ich gerade bemerkt dass ich 4 Fehler drin habe. Hab vergessen 4 Image Tags zu schließen is aber halb so wild.

Das Produkt gefällt meinem Kunden zwar aber wollte halt die Meinungen anderer hören.

Kann ichs darin posten?

Gruss
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück