zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden n Div's in eine Zeile

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 20.08.2009, 14:49
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.08.2009
Beiträge: 5
Mustangore befindet sich auf einem aufstrebenden Ast
Standard n Div's in eine Zeile

Guten Tag,

ich haben mich eben angemeldet, da ich in nächster Zeit sehr wahrscheinlich ein paar Fragen bzgl. CSS haben werde.

Ich versuche seit ein paar Stunden folgendes umzusetzen:

Ich möchte gern n Div's (die Anzahl der Div's ist bei jedem Aufruf unterschiedlich) in einer Zeile eines Div's mit der Länge 100% anzeigen lassen. Diese n Div's sollen die 100% der gegebenen Länge ausnutzen und alle die gleiche Länge haben.

Wenn ich die Anzahl der Div's wüsste, würde ich z.B. bei 3 Div's mit "width: 33%" arbeiten, das geht in diesem Fall nicht. Wie kann ich das umsetzen?

Hier ein Beispiel:

HTML-Code:
<div style="width: 100%">
    <div>asd</div>
    <div>cdf</div>
    <div>ghi</div>
    ...
    ...
</div>
Hier werden die 100% des Div's nicht ausgenutzt, was ich jedoch gern umsetzen würde.
Über eine Gedankenhilfe würde ich mich sehr freuen.

Danke und Gruß
Mustangore
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 20.08.2009, 14:55
Benutzerbild von Praktikant
Semantikbremse.
XHTMLforum-Kenner
 
Registriert seit: 22.04.2008
Beiträge: 4.992
Praktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz sein
Standard

Probiers mal mit php. Irgendwann musst du doch rausbekommen, wie viele div's anzuzeigen sind und dann kannste die Breiten berechnen (100/anzahlDivs) und dieses Ergebnis (auf 2 Nachkommastellen runden) bekommen die einzelnen div's als Breite.
Oder soll das einfach ne statische HTML-Seite sein?
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 20.08.2009, 14:59
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.08.2009
Beiträge: 5
Mustangore befindet sich auf einem aufstrebenden Ast
Standard

Ich könnte das mit PHP lösen, aber ich setze PHP nur ungern in mein Design ein. Eine Trennung vom Skript zum Design sieht einfach schöner und übersichtlicher aus.

Gibt es sonst keine Möglichkeit, die Div's wie oben beschrieben anzuzeigen?

Danke und Gruß
Mustangore
Mit Zitat antworten
  #4 (permalink)  
Alt 20.08.2009, 15:17
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.864
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Dank IE < 8 nicht, denn der kennt keine Tabellen-Eigenschaften.

Was soll denn das Ganze letztlich werden?
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
  #5 (permalink)  
Alt 20.08.2009, 15:28
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.08.2009
Beiträge: 5
Mustangore befindet sich auf einem aufstrebenden Ast
Standard

Ich möchte diese Baumstruktur implementieren. Hier mal ein Screenshot:



Die Anzahl der Knoten die sich im roten Viereck befinden kann beliebig sein.
Ich weiß wie ich das mit PHP umsetzen könnte. Ich versuche jetzt erstmal das Design zu erstellen und habe diesen einen Wunsch, kein PHP in mein Design einzubauen.

Gibt es keine Möglichkeit, die Div's über 100% in n gleich lange Elemente zu "teilen" unabhängig von n?

Geändert von Mustangore (20.08.2009 um 15:30 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 20.08.2009, 15:53
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.864
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Ohne PHP wird es für IE < 8 nicht gehen. Du musst per PHP aber eh nichts weiter tun, als die Anzahl der divs zu ermitteln und daraus den Wert für ihre width-Deklaration zu errechnen. Notfalls schreibst Du ihn in ein Style-Element im Head, dann ist Deine eigentliche CSS-Datei immer noch komplett unabhängig von PHP.

Und Du kannst dieses Style-Element sogar noch in einen Conditional Comment schreiben, dann liest ihn er nur der IE < 8, während alle anderen Browser eine Lösung durch die bereits erwähnten Tabellen-Eigenschaften bekommen.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
  #7 (permalink)  
Alt 20.08.2009, 16:00
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.08.2009
Beiträge: 5
Mustangore befindet sich auf einem aufstrebenden Ast
Standard

Dachte es wäre einfacher, eventuell eine Eigenschaft die ich noch nicht kenne oder ein Trick der das Problem ohne PHP umgeht.

Aber eine Frage habe ich noch: Was meinst du mit Tabelleneigenschaften?
Meinst du damit, dass es am besten mit Tabellen zu realisieren wäre, oder hat CSS Eigenschaften, die ähnlich zu Tabellen in HTML sind? Ich versteh leider nicht was du meinst.

Vielen Dank für deine Hilfe.

Gruß
Mustangore
Mit Zitat antworten
  #8 (permalink)  
Alt 20.08.2009, 16:06
Benutzerbild von Praktikant
Semantikbremse.
XHTMLforum-Kenner
 
Registriert seit: 22.04.2008
Beiträge: 4.992
Praktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz sein
Standard

Tabelleneigenschaften im CSS sind sowas wie display:table; oder display:table-row; usw.
Google mal nach CSS-Tabelle oder Tabelle mit CSS erstellen
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
Mit Zitat antworten
  #9 (permalink)  
Alt 20.08.2009, 16:11
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.08.2009
Beiträge: 5
Mustangore befindet sich auf einem aufstrebenden Ast
Standard

Dankeschön! =)
Ihr habt mir sehr geholfen.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 20.08.2009, 16:19
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.864
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von Mustangore Beitrag anzeigen
eine Eigenschaft die ich noch nicht kenne
Du und der IE < 8

Die bereits erwähnten Eigenschaften setzt man nach folgendem Prinzip ein: Ein div bekommt display: table;, darin liegt ein weiteres div mit table-row, und darin liegen dann nebeneinander die ganzen divs mit unbekannter Anzahl, und bekommen logischerweise display: table-cell. Dann verhält sich diese Konstruktion wie eine Tabelle, obwohl es natürlich keine ist.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten.
Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.)
Mit Zitat antworten
Sponsored Links
Antwort

Stichwörter
div in eine zeile

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Sitecheck für Urlaubsunterkunft in Kroatien Miso Site- und Layoutcheck 11 19.10.2008 21:53
Mehere DIVs zentriert in eine Zeile? julben CSS 5 22.09.2008 08:15
Festanstellung bei der Xing AG als Web Developer (HTML/CSS) NEOX Offtopic 10 17.07.2008 18:11
Pre-Tag mit overflow: auto - Bug? (IE) RomanM CSS 3 26.12.2007 19:21
2 floatende divs - erste zeile um 1px eingerückt im ie woba_inter CSS 2 01.11.2006 18:12


Alle Zeitangaben in WEZ +2. Es ist jetzt 01:28 Uhr.