Ergebnis 1 bis 6 von 6

Thema: 3 Div Container nebeneinander

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

    Standard 3 Div Container nebeneinander

    Hallo, ich mächte gerne 3 Div Container neben ein ander darstellen lassen.

    HTML

    HTML-Code:
    <link rel="stylesheet" type="text/css" href="/style/footer-style.css" /> <div id="menu"><h2>Informationen</h2><li><a href="#" rel="nofollow">Kontakt</a></li><li><a href="#" rel="nofollow">Partner</a></li><li><a href="#" rel="nofollow">Datenschutz</a></li> <li><a href="#" rel="nofollow">Impressum</a></div><div id="info">Änderungen  und Irrtümer vorbehalten. Keine Garantie über Vollständigkeit,  Richtigkeit oder Aktualität der Angaben. Dies beinhaltet besonders  direkte und indirekte Links zu anderen Webseiten. Für den Inhalt der  verlinkten Seiten sind ausschließlich deren Betreiber verantwortlich.  Wir übernehmen keinerlei Garantie für die Richtigkeit, den Erhalt oder  das Funktionieren angebotener Produkte. Die Markennamen und Warenzeichen  sind Eigentum der rechtmäßigen Eigentümer und werden hier  ausschliesslich zur Produktbeschreibung eingesetzt.</div><div id="facebook"><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fdiamondkey.de&amp;width=180&amp;height=258&amp;colorscheme=light&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:180px; height:258px;" allowTransparency="true"></iframe></div>
    CSS

    Code:
    #menu {
         background-color: #FFFF00;
         width: 160px;
         height: 300px;
         display: inline-block;
     }
      
     #info {
         background-color: #008000;
         width: 560px;
         height: 300px;
         display: inline-block;   
     }
      
     #facebook {
         background-color: #FF0000;
         width: 180px;
         height: 300px;
         display: inline-block;
     }
    nun passt allerdings die höhe der div´s container nicht.

    Link zur homepage http://diamondkey.de/ es wird im footer dargestellt.
    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 !!!!!

  2. #2
    Bandit
    Gast

    Standard AW: 3 Div Container nebeneinander

    CROSSPOSTING

    Auszug aus den Forenregeln:
    Inhalt von Beiträgen:
    Forum-Hilfe behält sich das Recht vor, jederzeit Beiträge zu löschen, zu verschieben oder zu überarbeiten, die nicht den Forumsregeln entsprechen. Dies geschieht ohne vorherige Information des Verfassers. Die User ist alleine für die von ihnen publizierten Inhalte (Texte; Bilder oder andere Veröffentlichungen) verantwortlich und bestätigt auch damit, das er keine Copyrightgeschütze Werke und Texte hier im Forum veröffentlicht.
    Verboten oder auch unerwünscht sind folgende Inhalte:

    • extrem politisch oder religiös orientierte Postings
    • strafbare, pornographische, jugendgefährdende, beleidigende oder ehrverletzende Inhalte
    • Warez oder fremde copyrightgeschütze Werke
    • E-Mail Adressen
    • Songtexte
    • persönliche Angaben wie Telefonnummern, Adressen usw (diese bitte per PN austauschen)
    • oder anderweitig inakzeptabel Postings, die hier nicht erfasst wurden, aber gegen geltendes Recht, die guten Sitten, allgemeines Moralempfinden oder eben gegen die Forenregeln verstossen.
    • Crosspostings - die gleiche Frage in mehreren anderen Foren gleichzeitig stellen

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    21.12.2013
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: 3 Div Container nebeneinander

    aber wenn ich einen
    float: left;
    display: inline;
    hinzufüge passiert nichts...

    also ich habe jetzzt aus <div id="menu, info und facebook" jetzt <div class="menu, info und facebook"> gemacht und jetzt sind die boxen verschoben und eine bos ist weiter unten, warum?

    Habe gerade schon die suchfunktion benutz, habe da auch etwas gefunden bin aber auf keine lösung bekommen.
    Geändert von Maurice EL (21.12.2013 um 17:52 Uhr)

  4. #4
    Bandit
    Gast

    Standard AW: 3 Div Container nebeneinander

    Nur weil du dein Problem in einem anderen Forum postest, ändert das nichts daran, dass du erst einmal die Fehler im HTML-Code beseitigen solltest.

  5. #5
    Samurai Avatar von Bleistift
    Registriert seit
    20.03.2012
    Alter
    21
    Beiträge
    235
    Danke
    0
    Bekam 4 mal "Danke" in 4 Postings

    Standard AW: 3 Div Container nebeneinander

    nun passt allerdings die höhe der div´s container nicht.
    display: inline-block;

    erweitert die Länge des Containers, soweit sie benötigt wird.
    Wenn dein eines div also kleiner ist, ist dein anderes natürlich NICHT auch kleiner.

    Deine Elemente haben keine andere Position oder Höhe.
    Sie haben alle die gleiche Höhe.

    Deine Info-Box müsste ein float: left bekommen und deine Facebookbox ein float: right am besten.
    Alternativ kannst du für die 3 Spalten schon fast wieder eine Tabelle anlegen, oder dir mit divs deine eigene bauen.
    Du musst darauf achten, dass dein Hauptcontainer auch die entsprechende Breite hat.

    In deinem mittleren Container hast du ein break am Anfang des Containers.
    Bei der Facebookbox zum Beispiel nicht.

    Du verschachteslt da auch tausend mal die gleichen Elemente, die dir eigentlich nur ca 40Pixel klauen und einen Overhead erzeugen.
    Wie Bandit gesagt hat, du solltest deinen Code mal überprüfen.
    Dann kommt es in der Regel gar nicht zu so teilweise "unsauben" Code.
    Geändert von Bleistift (23.12.2013 um 20:52 Uhr)


  6. #6
    HTML Newbie
    Registriert seit
    22.12.2013
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: 3 Div Container nebeneinander

    Hallo, zuerst zu CSS
    Code:
    #menu {
         background-color: #FFFF00;
         width: 160px;
         height: 300px;
         display: block;
         float: left;
    
     }
      
     #info {
         background-color: #008000;
         width: 560px;
         height: 300px;
         display: block;   
     }
      
     #facebook {
         background-color: #FF0000;
         width: 180px;
         height: 300px;
         display: block;
         float: right;
     }
    und in HTML einfach die reihenfolge vertauschen...
    HTML-Code:
    <div id="menu"></div>
    <div id="facebook"></div>
    <div id="info"></div>
    TIPP: #info einfach ohne width: 560px; dann sieht besser aus.

Ähnliche Themen

  1. DIV nebeneinander anordnen?
    Von Niclas im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 21.02.2013, 23:06
  2. 2 divs nebeneinander
    Von ad3nau im Forum HTML & CSS Forum
    Antworten: 15
    Letzter Beitrag: 26.07.2006, 14:24
  3. bilder nebeneinander
    Von joy im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 1
    Letzter Beitrag: 10.08.2005, 21:23
  4. div's nebeneinander
    Von im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 11.06.2004, 19:25

Stichworte

Berechtigungen

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