div firefox problem

nikeshoxcc · 09.09.2009

hallo leute

hab zwei probleme.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>verein</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<center>
<body>
    <div id="content">
        <div class="navi">
            <p id="naviul">
                <span><a href="#Beispiel">Home</a></span>
                <span><a href="#Beispiel">bambini</a></span>
                   <span><a href="#Beispiel">f-jugend</a></span>
                   <span><a href="#Beispiel">e-jugend</a></span>
                <span><a href="#Beispiel">d-jugend</a></span>
                <span><a href="#Beispiel">c-jugend</a></span>
                <span><a href="#Beispiel">b-jugend</a></span>
                <span><a href="#Beispiel">a-jugend</a></span>    
             </p>
    
</div>
<div class="header">
        </div>
</div>

</body>
</center>

</html>

Code:

#content{
    text-align:center;
    width:850px;
    height:600px;
    background-color:#999999;
    z-index:1;
    position:absolute;
    top:30px;
    left:220px;
    }
.header {
    margin:auto;
    width:849px;
    height:101px;
    border-right:medium;
    border-left:medium;
    border-left-width:1px;
    border-right-width:1px;
    background-color:#0099CC;
    position:relative;
    top:0px;
    z-index:2;
    }
.navi {
    width:850px;
    height:25px;
    background-color:#0033FF;
    position:relative;
    z-index:2;
    text-align:center;
    }
p#naviul span{
    padding-right:20px;
    padding-left:20px;
    }

meine navileiste wird nicht ganz oben angezeigt. ( im ie iwie schon )
und die seite ist trotz center befehl nicht mittig..

sh0xcc

GoMeZ · 09.09.2009

AW: div firefox problem

Hi,

versuchs mal mit einem margin: 0 auto; im Content-id.

Gruß, der GoMeZ

sokie · 09.09.2009

AW: div firefox problem

wenn du den umhüllenden container absolute positionerst, hat er mit deinem"center" Bereich auch nichts mehr zu tun. wenn man ihn 30px vom top des Fensters verschiebt ist da natürlich ein 30px breiter Rand (oder sollte da sein). wenn das im IE nicht so ist, dann ist das kein Problem des FF sondern des IE.

statt ein p mit naviul empfiehlt sich eigentlich eine <ul> und die elemente darin als li (nicht als span)

wenn du dem hauptcontainer zentrieren willst, gibst du ihmeine breite und setzt die margins auf auto, dann wird er auch zentriert(allerdings NICHT ABSOLUT POSITIONIEREN!)

<center><body></body></center> ist falsch geschachtelt(<body><center>inhalte</center></body>)

sh0ck · 09.09.2009

AW: div firefox problem

bitte sehr. das ganze geht natürlich auch etwas verkürzt.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>VEREIN</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<style type="text/css">
<!--
#content{
width:850px; height:600px;
margin:0px auto;
background-color:#999999;
}

.navi {
width:100%; height:25px;
background-color:#0033FF;
text-align:center;
}

.navi a { padding:0px 20px; }

.header {
width:100%; height:101px;
background-color:#0099CC;
}
-->
</style>


</head>
<body>

<div id="content">

<div class="navi">
<a href="#Beispiel">Home</a>
<a href="#Beispiel">bambini</a>
<a href="#Beispiel">f-jugend</a>
<a href="#Beispiel">e-jugend</a>
<a href="#Beispiel">d-jugend</a>
<a href="#Beispiel">c-jugend</a>
<a href="#Beispiel">b-jugend</a>
<a href="#Beispiel">a-jugend</a>
</div>

<div class="header"></div>

</div>

</body>
</html>

grusss chris

nikeshoxcc · 09.09.2009

AW: div firefox problem

ich danke allen für die wirklich sehr gute hilfe

sh0xcc

afandetsasayav · 09.09.2009

AW: div firefox problem

Hallo lieber, ich bin auch css fan wie du aber manchmal stehen wir manchem Problem gegenüber, die unsere Kenntnis übersteigen, deshalb habe ich einen Tipps für dich um dir mehr mühe zu ersparn, ich empfehle dir diese Seite YAML Builder | A tool for visual development of YAML based CSS layouts dort kannst du mit einem tool deine html seite mit css entwerfen und den code nach deinen bedürfnissen anpassen, diesen Tipp habe ich von einem bekannten werbentwickler Thomas Kötter der sogar Videotrainings veröffentlicht bei der firma Galileo computing damit wird alle deine probleme mit css und html gelöst auch damit bist du sicher wie kein problem mit irgendwelchem browser zu bekommen