CSS wird geladen aber nicht interpretiert

[uthred]

Hi,

Ich habe das Problem, das alle Browser bis auf IE dieses CSS-Dokument nicht anwenden, sie laden es zwar und man sieht es beim Untersuchen auch, aber außer in IE(9) lädt es nicht:

/* Browser-Spezielle Einstellungen überschreiben */

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, embed,

figure, figcaption, footer, header, hgroup,

menu, nav, output, ruby, section, summary,

time, mark, audio, video {

	margin: 0;

	padding: 0;

	border: 0;

	font-size: 100%;

	font: inherit;

	vertical-align: baseline;

}


/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,

footer, header, hgroup, menu, nav, section {

	display: block;

}


body {

	line-height: 1;

}


ol, ul {

	list-style: none;

}


blockquote, q {

	quotes: none;

}


blockquote:before, blockquote:after,

q:before, q:after {

	content: '';

	content: none;

}


table {

	border-collapse: collapse;

	border-spacing: 0;

}

/* Site Elements*/

div.ergo

{

	margin:0 auto;

}


.ergo label

{

	width: 200px;

	text-align: left;

}

Das CSS-Dokument wird in einen PHP-File aufgerufen

<link rel="stylesheet" href="style.css" />

Die PHP-Datei erstellt ein Formular.

Bitte sagt mir was ich falsch mache.

[Aras]

<link rel="stylesheet" type="text/css" href="style.css" />

Soweit ok?

[flashpixx]

prüfe das CSS im Validator, das wäre der erste Punkt. Die Aussage, dass es im PHP File aufgerufen wird ist falsch, denn das CSS spielt nicht für das PHP File eine Rolle, sondern für das durch das PHP File generierte HTML Dokument, d.h. bezüglich des HTML Dokumentes muss es stimmen.

[uthred]

Also, die Einzelnen Zeilen funktionieren alle, mit ausnahme vom width-Befehl, der funktioniert nur im IE.

wenn ich in der ergo oder Label-Klasse anderen Code reinschreibe funktioniert dieser auch ( margin: 20px; ).

Der CSS-Validator findet auch keine Fehler, ...

[Aras]

Verwendest du es überhaupt richtig?

machst du

<div class="ergo">

<label>bla</label>

</div>

Nicht dass du statt class id vergibst.

[uthred]

ja ich verwende es richtig und wie gesagt IE macht es auch richtig FF und co. leider nicht

[Aras]

Pack mal alles in eine Zip und lad es hoch

So kann man es leider nicht nachvollziehen

[uthred]

<div class="ergo">

	<p>

		<label>User:</label>

		<select id="user">';

		echo "<option>user</option>";

		echo '</select><a href="user.php" class="link">new User?</a>

	</p>


	<p>

		<label>typ:</label>

		<select id="book">';

		echo "<option>bsp. book</option>";

		echo '</select><a href="Book.php" >new Book?</a>

	</p>

	<p>

		<input type="submit" id="abgeschickt" >

	</p>

</div>[/PHP]

Der Code ist um ein paar Datenbank-abfragen gekürzt, die einzelnen options werden über Datenbank-abfragen generiert, die alle Werte aus der Array holen, funkt. auch wunderbar nur die Darstellung spinnt.

Da es Betriebsgeheimnisse umfasst, kann ich leider nur diese gekürzte Variante vorlegen und nichts hochladen

[Aras]

Da der Code den du hier präsentierst auch einfach nur "Schrott" ist, solltest du dich an deinen Ausbilder wenden.

Dieser sollte dir auch bei diesen wertvollen Betriebsgeheimnissen helfen können.

[uthred]

Werde ich tun, aber warum ist er "Schrott" ich habe lediglich ein paar funktionen außen vor gelassen und ein paar Namen geändert.

Ansonsten ist der Code gleich, es ist ein Formular mit select-Feldern und einen Sende-Button. Das die optionen aus ner Datenbank entstehen und das hier nicht drin ist macht den Code doch nicht schrottig?!

Wenn jedoch Codetechnisch etwas Schrott ist, dann sag es doch einfach.

[uthred]

So habs jetzt rausgefunden, ohne Ausbilder...

Ich wüsste zwar gerne wieso es nicht funktioniert hat, denn eig. müsste es funktionieren, aber die funktionierende Variante lautet:

div.ergo

{

    background-color: #EFEFEF;

    border: 1px solid #444444;

    margin: 50px auto;

    padding: 40px;

    width: 1000px;

}


 label

{

    display: block;

    float: left;


    padding-right: 150px;

    text-align: left;

    width: 100px;

}

width und height wurden, weiß Gott warum, immer ignoriert.

[Aras]

Dein Codebeispiel ist eine Mischung aus php und html. Den kann man nicht ausführen ohne dass man selber Zeit dafür investiert. Oder denkst du ich kann das als html abspeichern und sofort testen? Ne ich müsste das erstmal anpassen und Zeit ist Geld.

Label ist ein inline-Element. Dadurch hattest du keine feste width und height. Durch Display Block ist es ein Blockelement.

[uthred]

Und wieder was dazu gelernt, ...

Auch wenn

float: left;

padding-right: 150px;

text-align: left

ebenfalls benötigt werden, da es ansonsten auch nicht funktioniert...

Das nächste mal konzentrier ich mich darauf rein html zu posten, falls dies möglich ist.

[Aras]

Mit float:left nimmst du das Objekt aus dem Textfluß (inline) raus und dann wird das Label Element auch zu einem Blockelement.

[uthred]

gut zu wissen, danke.