1. #1
    Avatar von exception
    Registriert seit
    27.03.2012
    Beiträge
    198
    Thanked 57 Times in 36 Posts

    Standard [CSS] Problem mit Padding

    Hallo!
    Traurigerweise scheitere ich gerade bei den Grundlagen von CSS. lol^^

    Folgender Quelltext:

    Code:
    <div id="head">
    	<div id="headContainer">
    		<div id="headLeft">x</div>
    		<div id="headRight">y</div>
    	</div>
    </div>
    
    #head {
    	display: block;
    	width: 100%;
    	margin: 0px auto;
    	padding: 10px 0 10px 0;
    	background: #0D0D0D;
    	border-bottom: 1px solid #0A0A0A;
    }
    
    #headContainer {
    	display: block;
    	width: 800px;
    	margin: 0 auto;
    	font-family: Tahoma;
    	font-size: 17px;
    	color: #FFF;
    	background: red;
    }
    
    #headLeft {
    	width: 250px;
    	float: left;
    	background: green;
    }
    
    #headRight {
    	width: 550px;
    	float: left;
    	background: orange;
    }
    #headContainer sollte sich in #head befinden und ein padding von 10px haben(top, bottom).
    Stattdessen wird #headContainer etwas unterhalb von #head angezeigt. Warum?

    Preview: Title

    Wenn ich allerdings #headLeft und #headRight aus #headContainer entferne, funktioniert es
    genau so wie ich will, nur das es halt ein einzelner Container ist.

    Siehe http://nethox.bplaced.net/cur2

    MfG


    Edit:
    Ich will keine fixen height-Werte benutzen, sonst wäre das ganze ja kein Problem.
    Geändert von exception (15.11.2013 um 00:48 Uhr)
    Ich will Geld haben und zwar so viel, das ich auch mal sagen kann das es Wichtigeres gibt...

  2. #2
    Avatar von Devon
    Registriert seit
    18.11.2011
    Beiträge
    2.188
    Thanked 1.574 Times in 1.023 Posts

    Standard AW: [CSS] Problem mit Padding

    Füg #head noch folgenden Wert hinzu:

    HTML-Code:
    height: 20px;
    Dann funktioniert es ohne #headLeft und #headRight zu entfernen. Hab ich eben getestet bzw. ausprobiert mit Firebug. So wie du es wolltest, oder?
    Geändert von Devon (15.11.2013 um 00:53 Uhr)

  3. #3
    Avatar von exception
    Registriert seit
    27.03.2012
    Beiträge
    198
    Thanked 57 Times in 36 Posts

    Standard AW: [CSS] Problem mit Padding

    Jap, so sollte es dann aussehen. Die Sache ist nur die, das ich keine Fix-Werte verwenden will.
    Wenn ich jetzt zB. die Schriftgröße in #headLeft größer mache, würde es erst wieder nicht
    passen weil der Abstand nach unten sich verkleinert.
    Ich will Geld haben und zwar so viel, das ich auch mal sagen kann das es Wichtigeres gibt...

  4. #4

    Registriert seit
    28.10.2011
    Beiträge
    625
    Thanked 279 Times in 168 Posts

    Standard AW: [CSS] Problem mit Padding

    Stattdessen wird #headContainer etwas unterhalb von #head angezeigt. Warum?
    Wenn man Floatet, sollte man dieses auch danach wieder zurücksetzen.

    PHP-Code:
    <div style="float:left;">Links<div>
    <
    div style="float:right;">Rechts<div>
    <
    div style="clear:both;"><div

Ähnliche Themen

  1. FF IV Problem
    Von Dewu im Forum Android
    Antworten: 0
    Letzter Beitrag: 19.06.2013, 21:17
  2. Problem mit CSS
    Von Kolle1991 im Forum Counter Strike
    Antworten: 7
    Letzter Beitrag: 31.07.2012, 17:32
  3. Skype-Problem: Problem mit dem Wiedergabegerät
    Von Scarface im Forum Audio & Video
    Antworten: 0
    Letzter Beitrag: 16.07.2012, 23:58
  4. MSN Problem
    Von GXC1 im Forum Software
    Antworten: 3
    Letzter Beitrag: 29.06.2012, 12:08
  5. RAM Problem
    Von Localhost im Forum Hardware
    Antworten: 1
    Letzter Beitrag: 24.04.2012, 22:37
Diese Seite nutzt Cookies, um das Nutzererlebnis zu verbessern. Klicken Sie hier, um das Cookie-Tracking zu deaktivieren.