[CSS]float:left; - Softwareontwikkeling

dinsdag 23 maart 2004 15:00

Acties:

Topicstarter

Ik ben bezig met de website, maar ik loop tegen een een probleem op. na even met float: left te hebben genutseld lukt het niet meer helemaal. Ik heb de volgende code:

Cascading Stylesheet:

body {
    background-color:#5C5E65;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:10px;
    margin:0px;
    color:#5C5E65;
    }
div.header {
    background-image:url(images/header.jpg);
    width:902px;
    height:81px;
    background-repeat:no-repeat;
    position:relative;
    }
div.footer {
    background-image:url(images/footer.gif);
    width:902px;
    height:24px;
    background-repeat:no-repeat;
    position:relative;
    }
div.all {
    background-color:#E1E7F4;
    width:902px;
    height:auto;
    }
div.menu {
    background-color:#E1E7F4;
    width:902px;
    height:auto;
    float:left;
    }
div.menutitem {
    background-color:#E1E7F4;
    width:902px;
    height:auto;
    border:1px solid red;
    }

HTML:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="style.css" rel="stylesheet" type="text/css" />
<title>|| The Shadow Wolves || tsw-gaming.nl || There are more things in life than fun and joy! ||</title>
</head>
<body>
<div class="header"></div>
<div class="all">
    <div class="menu">
        <div class="menutitem">Hallo</div>
    </div>
</div>
<div class="footer"></div>

</body>
</html>

Als je de site in mozilla bekijkt dan ziet het er op de volgende manier uit:
Afbeeldingslocatie: http://www.tsw-gaming.nl/new/mozilla.jpg

explorer

Hoe kan ik maken zodat het er net zo uit komt te zien als bij explorer? Ik heb een aantal dingen geprobeerd, maar als ik float's gebruik in mozilla dan kan ik er niets meer relatief onder positioneren ofzo.

dinsdag 23 maart 2004 15:08

Acties:

T-MOB

Je moet zorgen dat er een "clear" komt na je floatende menu. Floatende elementen tellen niet mee bij de bepaling van de hoogte van het parent element (en dat moet ook niet

).

Als je na <div class"menu">...</div> deze code plaatst komt het allemaal goed

code:

1	<br style="clear: both" />

Regeren is vooruitschuiven

dinsdag 23 maart 2004 15:18

Acties:

GoddXX2

Topicstarter

thnx, ik wist dat het niet zo moeilijk was