• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Text soll Menü umfliesen

reaton

Neues Mitglied
Hi,
erstmal bitte ich um Entschuldigung, dass ich schon wieder um Rat in diesem Forum bitte, aber ich habe zurzeit bei dem Erstellen einer Website immer wieder mit für mich unlösbaren Problemen zu kämpfen. Diese kommen, da ich bisher nur sehr unkonventionell und sehr schnipselweise html/css gelernt habe, und ich noch keine passende Fachliteratur/website gefunden habe!

Also, dank threadi habe ich jetzt mein Menü an der Seite im Contentdiv optisch "schön".
Jetzt ist es aber wie auf dem screen zu sehen, so, dass der Text nur unter dem Menü ist, und das Menü nicht umfließt.

menuprb2.JPG

Hier ist diesmal mein kompletter CSS-Code ;-) dafür!

Code:
* {
     margin:0px;
     padding:0px;
}

body {
     background-color:#FFF;
     background-image:url(../images/Rautenmuster3.jpeg);
     background-repeat:repeat;
     font-family:Arial;
     color:#000;

}

#wrapper {
     width:1125px;
     margin: 10px auto;
}

#header {
     width:491px;
     height:120px;
     background-image:url(../images/headerh4.jpg);
     background-repeat:no-repeat;
     margin-left:300px;
}

#content {
     background-image:url(../images/);
     background-color:#FFFFFF;
     background-repeat:repeat;
     padding:15px;
     padding-bottom:30px;
}


#navi {
     width:300px;
     padding-left:0px;
}


#footer {
     background-color:#283B60;
     height:37px;
     text-align:center;
     padding-top:2px;
     color:#FFFFFF;
     font-size:14px;
}

#menu ol a:link, #menu ol a:visited, #menu ol a:active {
     border: 1px solid #000066;
     display: block;
     margin-bottom:-18px;
     width:90px;
     padding:5px;
     background-color:#4b8ae6;
     text-decoration:none;
     color:#FFFFFF;
     font-weight:bold;
}

#menu ol a:hover {
     background-color:#FF8200;
     color:#000000;
     font-weight:bold;
}

Vielen Dank für Antworten!

Grüße
 
ich glaube das mit float ist die elegantere Variante!?

Also das hier ist meine Divstruktur:

Code:
<body>
         <div id="wrapper">
                 <div id="header"></div>
                 <div id="content">
                 <div id="navi"><div id="menu">
                 <ol>
                         <a href="index.php">Startseite</a><br />
                         <a href="index.php?page=igao">IGAO</a><br />
                         <a href="index.php?page=vereine">Vereine</a><br />
                         <a href="index.php?page=kirche">Kirche</a><br />
                         <a href="index.php?page=kandler">Kandler</a><br />
                         <a href="index.php?page=geschichte">Geschichte</a><br />
                         <a href="index.php?page=impressum">Impressum</a><br />
                 </ol>

                 </div></div>
                 <?php  include("$filename"); ?></div>
                 <div id="footer">Copyright &copy; 2010 Manuel Burger, Alle Rechte vorbehalten<br />
                 Startseite | Sponsoren | Impressum</div>
         </div>
</body>

Und soweit ich das jetzt verstanden habe, muss ich im tag nach div id="menu" noch style = "float:left;" mit reinmachen?
 
Hallo.

Das float left solltest du in dein CSS reinmachen.

Noch einen Verbesserungsvorschlag.
Du hast zwar eine geordnete Liste aber keine Listenpunkte.
Warum zeichnest du deine Links nicht als Listenpunkte aus?
Dann kannst du sie leichter formatieren und kannst dir das Div und die unnützen <br /> sparen.

Gruss
Elroy
 
Zurück
Oben