✔ divs in eine externe css-Datei

[fussballhitz]

Hallo!

Vielleicht könnt Ihr mir helfen.

Ich würde gerne mehrere divs in eine externe css-Datei auslagern aber irgendwie bekomme ich das nicht hin.

Für eure Antworten schon mal Danke.

Gruß
Fussball-Hitz

 

[Maik]

Wenn du uns den dazugehörigen Quelltext (HTML + CSS) zeigst, können wir dir sicherlich weiterhelfen.

 

[fussballhitz]

OK. Sorry.
Dieses ist meine layout.css
In dieser möchte ich nun div-Angaben machen die dann auf der index.htm dargestellt werden.

body {
font-family:verdana;
color:#ffffff;
font-size:10px;


scrollbar-face-color:#FFFFFF;
scrollbar-shadow-color:#000099;
scrollbar-highlight-color:#000099;
scrollbar-3dlight-color:#000099;
scrollbar-darkshadow-color:#000099;
scrollbar-track-color:#FFFFFF;
scrollbar-arrow-color:#000099;

background-image:url(http://www.blau-weisse-statistik.de//grafik/sonstiges/hintergrund.jpg); background-repeat: yes-repeat}

<!--
A:link {COLOR: #ffffff; TEXT-DECORATION: none}
A:visited {	COLOR: #ffffff; TEXT-DECORATION: none}
A:hover {	BACKGROUND: none transparent scroll repeat 0% 0%; COLOR: #; TEXT-DECORATION: underline}
A:active {	BACKGROUND: none transparent scroll repeat 0% 0%; COLOR: #; TEXT-DECORATION: underline}

//-->
}

Schaut euch mal die div-Bereiche auf meine Homepage an.
blau-weisse-statistik.de

Dort gibt es z.b. folgende div-Box

<div id="box100" style="border:0px solid green; margin:2px; background:#000080; position: absolute; left: 20px; top: 10px; width:2px; height:200px; z-index:2; padding-left:5px; padding-right:5px; padding-top:2px; padding-bottom:2px">&nbsp;</div>

Ich möchte nun alle div-Boxen über eine externe css steuern d.h wenn ich dort höhe und breiter der div box ändere soll das auf allen anderen seiten der homepage auch geschehen.

Gruß
Fusball.Hitz

 

[Maik]

Dann notiere die einzelnen ID-Selektoren (DIV-Boxen) und ihre CSS-Eigenschaften in der CSS-Datei nach folgendem Schema:

div#box100 {
    border:0px solid green; 
    margin:2px; 
    background:#000080; 
    position: absolute; 
    left: 20px; 
    top: 10px; 
    width:2px; 
    height:200px; 
    z-index:2; 
    padding-left:5px; 
    padding-right:5px; 
    padding-top:2px; 
    padding-bottom:2px;
}

div#box200 {
/* CSS-Eigenschaften */
}

/* usw. */

Der Aufruf erfolgt dann über das id-Attribut:

<div id="box100">...</div>

 

[deepthroat]

Hi.

Du mußt doch nur eine Regel für die div's in die CSS Datei einfügen und die CSS Datei von der HTML Datei referenzieren.

div#box100 { width:200px; height:150px }

Ich weiß jetzt nicht was du mit "alle" div Boxen meinst. Alle div Elemente die die ID box100 haben? Oder eine bestimmte Klasse?

Übrigens haben HTML Kommentare in CSS Dateien nichts verloren. CSS Kommentare werden mit /* eingeleitet und mit */ beendet.

Gruß

 

[fussballhitz]

Vielen vielen Dank michaelsinterface!

Ich werde das gleich einmal ausprobieren.
Sollten abschliessen noch Fragen sein werde ich mich nochmal hier melden.

Viele Grüsse
Fussball-Hitz

 

[Maik]

Ich weiß jetzt nicht was du mit "alle" div Boxen meinst. Alle div Elemente die die ID box100 haben? Oder eine bestimmte Klasse?

Dann werf mal einen Blick in den Quelltext des verlinkten Dokuments

 

[deepthroat]

Dann werf mal einen Blick in den Quelltext des verlinkten Dokuments

Oh, verstehe. Dann wäre es evtl. angebracht erstmal für die übereinstimmenden Eigenschaften eine Klasse zu definieren.

Da wurden anscheinend mehrere Dateien einfach hintereinander gehängt, seh ich das richtig? Ich zähle irgendwie 22 html Tags.

Gruß

 

[elecfuture]

Bitte achau deine Website mal im Firefox an. Die einzelnen Kästen sind verschoben.