1. Diese Seite verwendet Cookies. Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies. Weitere Informationen

CSS Formatierung

Dieses Thema im Forum "Web-Programmierung" wurde erstellt von mschoening, 01.06.07.

  1. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Hi,
    ich habe folgendes Problem: ich möchte ein DIV als "separator" benutzen. Der DIV hat per CSS ein "background-image" bekommen und soll 10px breit sein (das "background-image" widerholt sich auf der y-Achse, ist aber hier irrelevant). Das DIV ist im Code-Teil aber leer. Wie bekomme ich das mit CSS hin, dass es den trotzdem mit einer "width" von 10px anzeigt.

    Gibt es da auch browser-compatibility issues?

    Code:
    <div class="separator"></div>
    Code:
    .separator {
    float:left;
    width:10px;
    background-image:url(images/separator.png);
    background-repeat:repeat-y;
    }
    
     
    #1 mschoening, 01.06.07
    Zuletzt bearbeitet: 01.06.07
  2. Nighthawk

    Nighthawk Linsenhofener Sämling

    Dabei seit:
    16.12.06
    Beiträge:
    2.558
    Tippfehler?
    Möglichereweise liegt's da dran, dass nix angezeigt wird ;)

    EDIT: Ich seh grad, deine Höhenangabe fehlt. Füg noch ein height:XXpx; ein.
    EDIT2: Zu lahm...
     
  3. ChuckyGFX

    ChuckyGFX Roter Delicious

    Dabei seit:
    01.06.07
    Beiträge:
    91
    Versuch es mal indem du die höhe mit angibst. Das dürfte das problem eigentlich schon beheben.
     
  4. .holger

    .holger Geflammter Kardinal

    Dabei seit:
    13.09.04
    Beiträge:
    9.117
    die Klasse im CSS hat auch nen anderen Namen als das DIV.
     
  5. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    @Nighthawk: der Tippfehler ist nicht im original script nur hier im Forum.

    @ChuckyGFX/Nighthawk: Nein height kann ich nicht nehmen da ich eine flexible Höhe brauch! Den Separator müsst ihr euch ungf. als Bildversion von border-left:1px grey dotted; vorstellen
     
  6. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Nur hier im Forum...Tippfehler! Sorry :-D
     
  7. Nighthawk

    Nighthawk Linsenhofener Sämling

    Dabei seit:
    16.12.06
    Beiträge:
    2.558
    Du brauchst aber ne Höhe. Probiers halt mal mit 100%
     
  8. ChuckyGFX

    ChuckyGFX Roter Delicious

    Dabei seit:
    01.06.07
    Beiträge:
    91
    Ja aber wenn du ne flexible höhe brauchs...dann wird das ding doch eh gefüllt oda nicht?
    Ansonsten ne prozentzahl mit übergeben...
    ohne height wird das meiner meinung nach nix, weil ja kein bereich angegeben ist wo was rein muss...also wo ein background füllen wo kein inhalt ist? verstehst du was ich meine?

    // edit: diesma war ich zu spät ;D
     
  9. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Habt ihr noch einen Vorschlag ausser "height" mit anzugeben?

    EDIT: Ja moment ich versuche es mit 100%
     
  10. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Hi,
    also es geht nur mit fixen angaben wie PX, sobald ich % oder auto nehme wird nichts angezeigt. Noch einen Vorschlag? Ich hatte mal irgendwo gelesen in das div ein span Element einzufügen und dann im CSS noch etwas für das span zu definieren, habe es aber leider nicht mehr im Kopf. :(
     
  11. Nighthawk

    Nighthawk Linsenhofener Sämling

    Dabei seit:
    16.12.06
    Beiträge:
    2.558
    Prozentangaben müssten doch gehen?
    Probier mal position:absolute; bzw. position:relative;
     
  12. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
  13. .holger

    .holger Geflammter Kardinal

    Dabei seit:
    13.09.04
    Beiträge:
    9.117
    gib in das DIV ein &nbsp; ! - also zwischen die <div ...> </div> Tags.
     
  14. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Ja so gehts! Ist das auch valid CSS bzw XHTML? mit dem &nbsp;?
     
  15. .holger

    .holger Geflammter Kardinal

    Dabei seit:
    13.09.04
    Beiträge:
    9.117
    ja, das macht einfach nur ein Leerzeichen in HTML. also so:

    <div class="separator">&nbsp; </div>
     
  16. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Yep hast recht! Danke...

    ich habe noch eine Frage:

    was ist besser für ein 3-Spaltiges Layout:
    float left, float left und float right

    oder

    die erste Spalte so wie sie ist, die zweite position absolute und right:XXXpx, und die dritte position absolute und right:XXXpx

    Thanks,
     
  17. Nighthawk

    Nighthawk Linsenhofener Sämling

    Dabei seit:
    16.12.06
    Beiträge:
    2.558
      funktioniert tatsächlich, auch wenn man keine Höhe angibt, oder wie hast du es nun gelöst?
     
  18. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Ja mit  ...aber ich bin nocht nicht richtig zufrieden mit meine 3-Spalten Lösung
     
  19. .holger

    .holger Geflammter Kardinal

    Dabei seit:
    13.09.04
    Beiträge:
    9.117
    ja funktioniert.

    @m.schoening ich würd das ganze von links aufbauen mit absoluten Angaben.
     
  20. mschoening

    mschoening Gelbe Schleswiger Reinette

    Dabei seit:
    21.02.07
    Beiträge:
    1.764
    Ja werde ich so machen! Float ist bei IE 5.5 ja nicht so toll! Aber ich verstehe eins nicht:
    ich habe ein div als container um die 3 Spalten gemacht. So die erste spalte lasse ich ganz normal! Die zweite Spalte will ich mit absolute positionieren. Der positioniert die aber nicht relativ zu dem Container! Normalerweise ist absolute doch zu dem nächst höheren Element oder nicht?
     

Diese Seite empfehlen