Frage zu divs

Status
Nicht offen für weitere Antworten.

Daniel29

Erfahrenes Mitglied
Hallo,

ich habe ein Seitenlayout über divs mit container, head, links navi, und inhalt.

im inhalt wollte ich ein großes bild anordnen, darüber 2 kleine und unter dem großen 6 kleine.
das mit den 2 kleinen und dem großen klappt gut über divs. Nur bei den 6 darunter hauts garnicht hin. Habe es mit <ul> <li> </li> </ul> und dann display:inline; für ul probiert. Da rührt sich nichts. die sind alle untereinander angeordnet:confused:
Dann habe ich es über divs probiert mit padding. Das geht auch nicht. Kann mir vielleicht jemand weiterhelfen?

Jetzt hab ich nochmal ne Frage. Wenn ich in die divs direkt über style reinschreibe float:left, kann ich wunderbar 6 Bilder nebeneinander postitonieren. Wenn ich das gleiche über id im head mache, haut es nicht hin. Woran liegt das
 
ja gut werd das mal probieren. allerdings finde ich es komisch dass es einen unterschied macht ob ich über style in ein tag was reinschreibe oder ich es über klassen bzw. ID-Selektoren im Kopf mache.

Wie kann man sich denn eigenlich Rahmen zu den divs anzeigen lassen. Über border: 3px; beispielsweise funktioniert das nicht. Nur wenn ich einen border-style und eine border-color mitangeben. Ist das normal?
 
Daniel29 hat gesagt.:
ja gut werd das mal probieren. allerdings finde ich es komisch dass es einen unterschied macht ob ich über style in ein tag was reinschreibe oder ich es über klassen bzw. ID-Selektoren im Kopf mache.

Wie kann man sich denn eigenlich Rahmen zu den divs anzeigen lassen. Über border: 3px; beispielsweise funktioniert das nicht. Nur wenn ich einen border-style und eine border-color mitangeben. Ist das normal?


Ersteres wundert mich auch. Dazu zeigst du am besten mal den Quelltext und deine CSS Datei.

Zu der Border, das ist auch richtig so, um es etwas einfacher zu haben kannst du es allerdings noch zusammenfassen:


HTML:
#element {
     border: 1px solid #000;
}
 
Ahja,
also das mit den divs ist schon komisch...
Im Vergleich zu Tabellen irgendwie verwirrend. Und jeder Browser gibt was anderes aus:confused:
Jetzt wollt ich mal meine Bilderübersicht (6 kleine Bilder pro Zeile und dann so 10 Zeilen machen) würdest auch mit je einem span pro Zeile und dann mit width und height die Höhen und Breiten der Felder festlegen
 
Daniel29 hat gesagt.:
würdest auch mit je einem span pro Zeile und dann mit width und height die Höhen und Breiten der Felder festlegen

Nein das würde ich nicht. Du lässt die Bilder floaten, damit hast du die Bilder nebeneinander. Wenn du sechs Bilder in einer Reihe willst, schaust du wie breit das ist. Sagen wir einfach mal deine Bilder sind 100px breit, dann willst du noch einen Abstand zwischen den Bildern von 10px. Dann würde ich das in etwa so machen:


Code:
#container {
      width:660px;
}
#container img {
      float:left;
      margin:0 0 10px 10px;
}



Edit: Hier hast du nochmal ein kleines Beispiel. Wenn die Bilder alle vers. größen habe, geht das so natürlich nicht.
 

Anhänge

Zuletzt bearbeitet:
Danke für den Tip.
Da gibt es nur ein Problem: Die Bilder sind Hoch und Querformat, also unterschiedlich groß. Früher habe ich das mit Tabellenzellen gemacht die alle gleich groß waren. Was spricht denn dagegen
 
Naja, es gibt sicher auch eine Tabellen freie Lösung. Entweder nimmst du einfach in Kauf, dass nicht immer genau sechs Bilder in einer Reihe sind oder du ... Ich schau mir das morgen nochmal an.


Gruß
 
Das img-Element gehört zu den Inline-Elementen, was bedeutet, daß es keinen Absatz im Textfluss erzeugt und automatisch nebeneinander angeordnet wird. Daher frage ich mich, wofür die float-Eigenschaft gut sein soll?

Tabellen dienen nicht als Gestaltungswerkzeug einer Seite, sondern zum tabellarischen (spalten- und zeilenweise) Anzeigen von Daten.
 
Status
Nicht offen für weitere Antworten.
Zurück