1. Weiterleitung zu NetzLiving.de
  2. Forum
    1. Unerledigte Themen
  3. zum neuen Forum
  • Anmelden
  • Suche
Dieses Thema
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Seiten
  • Forum
  • Erweiterte Suche
  1. Informatik Forum
  2. Webmaster & Internet
  3. Web-/Grafikdesign

CSS Layout Problem, float

    • Frage
  • davewood
  • 17. Januar 2008 um 10:29
  • Unerledigt
Hallo zusammen,

das Informatik-Forum geht in den Archivmodus, genaue Informationen kann man der entsprechenden Ankündigung entnehmen. Als Dankeschön für die Treue bekommt man von uns einen Gutscheincode (informatikforum30) womit man bei netzliving.de 30% auf das erste Jahr sparen kann. (Genaue Infos sind ebenfalls in der Ankündigung)

Vielen Dank für die Treue und das Verständnis!
  • davewood
    Punkte
    3.204
    Beiträge
    536
    • 17. Januar 2008 um 10:29
    • #1

    Hallo

    Ich hab folgendes Problem welches man sich hier auch gleich anschaun kann.

    Eigentlich will ich ja folgendes.

    Am linken Rand des Bereichs ein Thumbnail mit Text darunter.
    Dann um ca halbe Höhe niedriger als das linke Bild, auf der rechten Seite ein Thumbnail mit Text darunter.
    Links wiederum mit vertikalem Abstand ... etcetc.

    Momentan ist das so gelöst:

    Code
    <div style="clear: right; float: left;">
       <img src="blablabla"><br />
       blablabla
    </div>
    
    
    <div style="clear: left; float: right;">
      <img src="blablabla"><br />
       blablabla
    </div>
    
    
    <div style="clear: right; float: left;">
       <img src="blablabla"><br />
       blablabla
    </div>
    Alles anzeigen


    ...

    Also schauts momentan eh fast so aus wie ichs will, aber die vertikalen Abstände zwischen den Bildern auf der linken bzw rechten Seite sollen geringer sein (ca die Haelfte)

    in freudiger Erwartung von Hilfe

    david

  • Ivy
    Punkte
    4.920
    Beiträge
    889
    • 17. Januar 2008 um 10:40
    • #2

    is vielleicht nicht die schönste lösung, aber wie wärs mit diesem margin-left bzw. margin-right, wo du den abstand vom seitenrand festlegst?

  • sloth
    Punkte
    1.717
    Beiträge
    314
    • 17. Januar 2008 um 10:41
    • #3

    Hmm.. geht das nicht irgendwie mit margin oder border oder so?
    Also einfach einen negativen Wert eingeben bzw mal ein bisschen rumspielen?


    edit: Ivy :<

  • jimbeam
    Punkte
    1.201
    Beiträge
    204
    • 17. Januar 2008 um 10:59
    • #4

    also margin-left bzw. right bringt nix, er will ja die höhenabstände verkleinern.

    negative werte werden meines Wissens nach von den Browsern unterschiedlich interpretiert.

    du könntest jedoch immer 2 bilder nebeneinander positionieren und das rechte immer um die halbe größe vom bild mit margin-top nach unten verschieben! vl reichts sogar wenn du nur das 1. bild nach unten verschiebst und die anderen richten sich danach aus!

    lg
    ARmin

  • java-girl
    Punkte
    2.037
    Beiträge
    357
    • 17. Januar 2008 um 13:55
    • #5

    Schon einmal probiert eine Tabelle zu verwenden?

  • maciek
    Punkte
    2.805
    Beiträge
    434
    • 17. Januar 2008 um 14:20
    • #6

    hilft das in etwa? Position (relative, -50px) dürfte eigentlich in keinem browser Probleme machen.

    HTML
    <div style="background-color:#f00; width:200px; height:100px; clear:both; float: left;">
       blablabla
    </div>
    
    
    <div style="background-color:#0f0; width:200px; height:100px; clear:both; float: right; position:relative; top:-50px;">
       blablabla
    </div>
    
    
    <div style="background-color:#00f; width:200px; height:100px; clear:both; float: left; position:relative; top:-50px;">
       blablabla
    </div>
    Alles anzeigen
  • a9bejo
    Punkte
    4.697
    Beiträge
    913
    • 17. Januar 2008 um 14:32
    • #7
    Zitat von java-girl

    Schon einmal probiert eine Tabelle zu verwenden?

    Ein sehr umstrittenes Thema:

    • Are Tables Really Evil?
    • Why avoiding tables (for layout) is important.
  • davewood
    Punkte
    3.204
    Beiträge
    536
    • 17. Januar 2008 um 15:10
    • #8

    Nein tables will ich vermeiden.

    maciek: Ich muss beim ersten Bild -50px, beim zweiten -100px, usw. verwenden.
    das setzt sich so fort. auch komisch.

  • java-girl
    Punkte
    2.037
    Beiträge
    357
    • 17. Januar 2008 um 15:13
    • #9
    Zitat von a9bejo

    Ein sehr umstrittenes Thema:

    • Are Tables Really Evil?
    • Why avoiding tables (for layout) is important.

    Hm, na ja, ich hab' auch schon viel schlechtes über Tabellen gehört.
    Aber ich bin nicht recht gut in Webdesign und kenn' mich da auch nicht so aus, solange der Validator keine Fehler ausspuckt reicht das für mich :D
    Auf jeden Fall wäre es eine schnelle Lösung die sicher funktioniert, was besseres als eine Tabelle weiß ich auch nicht...

    EDIT:

    Zitat


    Nein tables will ich vermeiden.

    Gut dann hat sich das erledigt ;)

  • maciek
    Punkte
    2.805
    Beiträge
    434
    • 17. Januar 2008 um 23:57
    • #10
    Zitat von davewood

    maciek: Ich muss beim ersten Bild -50px, beim zweiten -100px, usw. verwenden.
    das setzt sich so fort. auch komisch.


    das ist komisch ... was für ein Browser? Eigentlich müsste es konstant mit -50px gehen ...

  • davewood
    Punkte
    3.204
    Beiträge
    536
    • 18. Januar 2008 um 12:01
    • #11

    Ubuntu 7.10
    Firefox 2.0.0.11

  • Maximilian Rupp 27. Dezember 2024 um 00:12

    Hat das Thema aus dem Forum Grafik/Video nach Web-/Grafikdesign verschoben.

  1. Datenschutzerklärung
  2. Impressum