Ergebnis 1 bis 7 von 7

Thema: DIV schiesst über Box hinaus, warum?

  1. #1
    HTML Newbie
    Registriert seit
    18.09.2010
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard DIV schiesst über Box hinaus, warum?

    Hallo zusammen,

    hab nur ne kleine Frage. Wenn ihr euch mein Code anschaut, dann weiss man eigentlich schon was ich will. Ich will eigentlich nur wissen, warum die eine DIV Box mit dem Text BILDGROSS immer rausschiesst. Hab schon viel versucht, aber irgentwie komm ich nicht drauf. Der untere Teil mit "Beschreibung Beschreibung Beschreibung Beschreibung ......." soll nach unten gedrückt werden.
    PHP-Code:
    <div style="position:relative; top:50px; left:200px; width:900px; border:solid 10px #00F">

    <
    div style="border:solid 8px #999; width:800px;">
    <
    div style="border:solid 3px #0FF;width:80px; height:55;">BILD1</div>
    <
    div style="border:solid 3px #666;width:80px; height:55;">BILD2</div>
    <
    div style="border:solid 3px #0FF;width:80px; height:55;">BILD3</div>
    <
    div style="border:solid 3px #666;width:80px; height:55;">BILD4</div>
    <
    div style="border:solid 3px #0FF;width:80px; height:55;">BILD5</div>
    <
    div style="border:solid 3px #666;width:80px; height:55;">BILD6</div>
    <
    div style="border:solid 3px #0FF;width:80px; height:55;">BILD7</div>
    <
    div style="border:solid 3px #666;width:80px; height:55;">BILD8</div>
    <
    div style="border:solid 3px #0FF;width:80px; height:55;">BILD9</div>
    <
    div style="border:solid 3px #666;width:80px; height:55;">BILD10</div>

    <
    div style="border:solid 2px #F00;width:600px; height:900px; position:absolute; top:0px; left:150px;">BILDGROSS</div>
    </
    div>

    <
    div style="border:solid 5px #C90;">Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung </div>
    </
    div
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Geändert von stamfix (18.09.2010 um 02:14 Uhr)

  2. #2
    Jedi Ritter Avatar von Dodo
    Registriert seit
    26.04.2008
    Ort
    Wien
    Alter
    27
    Beiträge
    3.774
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    1

    Standard AW: DIV schiesst über Box hinaus, warum?

    Zitat Zitat von stamfix Beitrag anzeigen
    Hallo zusammen,
    Hallo auch, und willkommen im Forum

    Zitat Zitat von stamfix Beitrag anzeigen
    Ich will eigentlich nur wissen, warum die eine DIV Box mit dem Text BILDGROSS immer rausschiesst.
    Wie meinst du "rausschießen"? Horizontal? Vertikal? Anders?

    Zitat Zitat von stamfix Beitrag anzeigen
    Der untere Teil mit "Beschreibung Beschreibung Beschreibung Beschreibung ......." soll nach unten gedrückt werden.
    Meinst du margin-top?

    Bei deinem Problem wäre ein Link oder wenigstens ein Screenshot hilfreich.
    Something big is coming. And there will be pirates and ninjas and unicorns...

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    18.09.2010
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: DIV schiesst über Box hinaus, warum?

    Hallo. Mit rausschiessen meine ich, das die DIV Box mit "BILDGROSS" in der Höhe nach unten rausschiesst. Wenn Du meinen Code im Editor einfügst und via Browser liesst, dann siehste was ich meine.
    Hab aber sicherheitshalber nochmal ein Screen gemacht. Der rote DIV Rahmen, schiesst nach unten raus. Der untere Teil mit Beschreibung, soll eigentlich weiter nach unten gedrückt werden
    Angehängte Grafiken Angehängte Grafiken
    Geändert von stamfix (18.09.2010 um 02:17 Uhr)

  4. #4
    Jedi Ritter Avatar von Dodo
    Registriert seit
    26.04.2008
    Ort
    Wien
    Alter
    27
    Beiträge
    3.774
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    1

    Standard AW: DIV schiesst über Box hinaus, warum?

    Das liegt daran, dass du absolute Positionierung verwendest.
    Du hast zwei Möglichkeiten:

    1) Dem Div mit der Beschreibung folgende Angaben geben:
    position:aboslute;
    top:904px;

    2) (hier die bessere Methode) Ein fließenden Layout mit "float" aufbauen.
    Something big is coming. And there will be pirates and ninjas and unicorns...

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    18.09.2010
    Beiträge
    4
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: DIV schiesst über Box hinaus, warum?

    Der DIV Box die absolute Position geben geht leider nicht, da es variabel sein soll. HIntergrund ist folgender, ich will eine Afterbuy eBay Bildergalerie bauen. Wo jetzt Bild 1 - 10 steht, soll später durch Afterbuy Variablen ersetzt werden, so das an der Stelle auch das Bild erscheint.
    Das ganze wird mit IF Abfragen gemacht, sprich, nur wenn Bild 10 in Afterbuy vorhanden ist, soll auch Bild10 angezeigt werden. Bild1-10 sind die Thums am Ende, mit Mouseover soll dann das BILDGROSS ausgetauscht werden. Und da die Bilder nicht immer alle die gleiche höhe haben, sollte der untere Bereich, also die Beschreibung, sich jedesmal an die neue Höhe anpassen. Hab das mit Float gerade versucht, doch irgentwie will das auch nicht so ganz.

  6. #6
    Jedi Ritter Avatar von Dodo
    Registriert seit
    26.04.2008
    Ort
    Wien
    Alter
    27
    Beiträge
    3.774
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    1

    Standard AW: DIV schiesst über Box hinaus, warum?

    Something big is coming. And there will be pirates and ninjas and unicorns...

  7. #7
    König(in) Avatar von Grevas
    Registriert seit
    20.04.2009
    Ort
    In meiner Wohnung.
    Alter
    30
    Beiträge
    1.039
    Danke
    0
    Bekam 5 mal "Danke" in 5 Postings

    Standard AW: DIV schiesst über Box hinaus, warum?

    HTML-Code:
    <div style="position:relative; top:50px; left:200px; width:900px; border:solid 10px #00F">
    <div style="border:solid 8px #999; width:800px;">
    
    <div style="border:solid 2px #F00;width:600px; height:900px; float:right; ">BILDGROSS</div>
    
    
    <div style="width: 200px;">
    <div style="border:solid 3px #0FF;width:80px; height:55;">BILD1</div>
    <div style="border:solid 3px #666;width:80px; height:55;">BILD2</div>
    <div style="border:solid 3px #0FF;width:80px; height:55;">BILD3</div>
    <div style="border:solid 3px #666;width:80px; height:55;">BILD4</div>
    <div style="border:solid 3px #0FF;width:80px; height:55;">BILD5</div>
    <div style="border:solid 3px #666;width:80px; height:55;">BILD6</div>
    <div style="border:solid 3px #0FF;width:80px; height:55;">BILD7</div>
    <div style="border:solid 3px #666;width:80px; height:55;">BILD8</div>
    <div style="border:solid 3px #0FF;width:80px; height:55;">BILD9</div>
    <div style="border:solid 3px #666;width:80px; height:55;">BILD10</div>
    </div>
    <div style="clear: both;"></div>
     </div>
     
    <div style="border:solid 5px #C90;">Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung </div>
    </div>
    oder noch besser:

    HTML-Code:
    <style>
    .clear { clear: both; }
    
    #main { position:relative; top:50px; left:200px; width:900px; border:solid 10px #00F; }
    #wrapper { border:solid 8px #999; width:800px; }
    #bigpic { border:solid 2px #F00;width:600px; height:900px; float:right; }
    #images { width: 200px; }
    #images div { border:solid 3px #0FF;width:80px; height:55; }
    #images div.second { border-color: #666; }
    
    #footer { border:solid 5px #C90; }
    </style>
    
    ...
    
    <div id="main">
      <div id="wrapper">
    
        <div id="bigpic">BILDGROSS</div>
    
    
        <div id="images">
          <div>BILD1</div>
          <div class="second">BILD2</div>
          <div>BILD3</div>
          <div class="second">BILD4</div>
          <div>BILD5</div>
          <div class="second">BILD6</div>
          <div>BILD7</div>
          <div class="second">BILD8</div>
          <div>BILD9</div>
          <div class="second">BILD10</div>
        </div>
        <div class="clear"></div>
    
        <div id="footer">Beschreibung Beschreibung  Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung  Beschreibung Beschreibung Beschreibung Beschreibung Beschreibung  </div>
      </div>
    </div>
    Geändert von Grevas (19.09.2010 um 16:46 Uhr)

Ähnliche Themen

  1. Navigation geht über das Navigationsframe hinaus
    Von 89noname89 im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 18.07.2010, 23:22
  2. Text ragt über div hinaus
    Von Unregistriert im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 21.09.2009, 14:14
  3. Text geht über Rand hinaus
    Von klsa12 im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 01.03.2008, 12:53
  4. Bild schießt über Div hinaus
    Von Guest im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 05.07.2007, 18:10
  5. °°JS-Navi soll über 2.Frame hinaus öffnen°°F1! F1!
    Von Blazin im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 19.07.2004, 16:42

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •