Lotta: Margin für p in floatendem div

SELF-Forum

Margin für p in floatendem div

Lotta
– Informationen zu den Bewertungsregeln

Hallo,
ich hänge schon eine ganze Weile an diesem Problem und bekomme es nicht hin.
Folgender Code soll eine Navigation ergeben. Hier floaten divs mit der Klasse nav1Cont, darin sind wiederum 2 divs nav1_1 u. nav1_2, darin ist jeweils ein Absatz. Das margin-top der p-Tags wirkt sich auf die divs nav1_1 u. nav1_2 aus. Im IE sieht es aus wie es soll, aber in Firefox und Opera stimmen die margin-top Werte nicht.

Für einen Tipp wäre ich sehr dankbar,
Grüße Lotta

  
<html>  
<head>  
<title></title>  
<style type="text/css">  
<!--  
#nav1 {height: 130px;width: 950px;}  
#nav1Image {height: 130px;width: 255px;float: left;background-color: #cdeaf9;}  
.nav1Cont {height: 130px;width: 180px;float: left;}  
.clear {clear: both;}  
.nav1_1 {background-color: #62c3ec;height: 35px;width: 180px;}  
.nav1_1 p {margin:  8px 0 0 47px;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 14px;font-weight: bold;color: #000000;}  
.nav1_2 {background-color: #b5e1f6;height: 95px;width: 180px;}  
.nav1_2 p {margin:  5px 0 0 47px;font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 11px;color: #006fab;}  
.nav1ImageTop {background-color: #e0f2eb;width: 255px;height: 35px;}  
-->  
</style></head>  
  
<body>  
<div id="nav1">  
  <div id="nav1Image">  
    <div class="nav1ImageTop"></div>  
  </div>  
  <div class="nav1Cont">  
    <div class="nav1_1">  
      <p>Angebot</p>  
    </div>  
    <div class="nav1_2">  
      <p>Aktionen<br>  
        Sortiment<br>  
        Dienstleistungen<br>  
      </p>  
    </div>  
  </div>  
  <div class="nav1Cont">  
    <div class="nav1_1">  
      <p>Service</p>  
    </div>  
    <div class="nav1_2">  
      <p>Fachbetriebe<br>  
        Veranstaltungen<br>  
        Seminare<br>  
        Links  
        <br>  
      </p>  
    </div>  
  </div>  
  <div class="nav1Cont">  
    <div class="nav1_1">  
      <p>Profil</p>  
    </div>  
    <div class="nav1_2">  
      <p>Unsere Genossenschaft<br>  
        Mitgliedschaft<br>  
        Standorte/Kontakt<br>  
        Immobilien<br>  
      </p>  
    </div>  
  </div>  
</div>  
</body>  
</html>
Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Margin für p in floatendem div

    Lotta
    – Informationen zu den Bewertungsregeln

    Hallo,
    ich habe mal ein Beispiel auf den Server geladen, vielleicht fällt dann ja jemandem was dazu ein.
    http://www.kompott.de/nav.htm

    Wie gesagt, die Anzeige im IE ist ok, Firefox, Safari und Opera beziehen das margin auf das div.

    Grüße Lotta

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln