PHPhulp.nl PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
B

CSS

Door Boy van Beurden op 30-11-2006 11:37
842 views
Krijg mijn menu en mijn container niet naast elkaar (althans niet in Firefox).

/* OPMAAK TEKST EN BODY */

body {
		background: #cfcfcf;
		color: #646464;
		text-align: left;
		font-family: Verdana, sans;
		margin-top: 0px;
		margin-right: 0px;
		margin-left: 0px;
}

a {
		text-decoration: none;
		color: #646464;
}

a:hover {
		text-decoration: underline;
}

/* HEADER */
#header {
			width: 430px;
			height: 150px;
			background-image: url('../images/header.jpg');
			border: 2px solid #000000;
			background-repeat: no-repeat;
			color: #ffffff
}

#hr {
		border: 1px;
		color: #ffffff;
}

#millshot {
		float: left;
		padding-right: 40px;
}

#volgjemij {
		float: right;
		padding-left: 40px;
		height: 25%;
		width: 25%;
		margin: 15px;
}

/* OPMAAK BLOKKEN */

#container {
			background-color: #acacac;
			width: 430px;
			top: 17px;
			float: right;
			color: #646464;
			position: relative;
			text-align: left;
			border: 2px solid #000000;
			margin-top: 0px;
			margin-right: 144px;
			margin-left: 0px;
}

#menu {
			width: 170px;
			background-color: #acacac;
			color: #000000;
			border: 1px solid #000000;
			margin-top: 40px;
			margin-right: 0px;
			margin-left: 45px;
			float: left;
			text-align: center;
}


en mijn HTML is:
<body>
&nbsp;<center><div id="header">&nbsp;</div></center>

<div id="menu">
	<a href="index2.htm">Home</a><br>
	<a href="index2.htm">statistieken</a><br>
	gastenboek beheer<br>
	verslagen beheer<br>
</div><div id="container">&nbsp;<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</p>
	<p>&nbsp;</div>
<p>&nbsp;</p>

</body>


en dus in IE lopen ze normaal naast elkaar maar in Firefox dus niet kan iemand helpen? Z.S.M alstublieft want dit is mijn stage opdracht:)
Terence Hersbach
30-11-2006 11:40
waarschijnlijk moet je alle floats eruithalen..
b
bart van der veen
30-11-2006 12:14
is denk ik css-box probleem voor ie zit in de marges/padding,
oplossing: maar een container waar menu en body(heet bij jou nu container) inzitten. voor menu en body geen margins of padding gebruiken en wel float. en voor container mag je margins bij de lieve leed bebruiken

+-------------------------------------------------------------------------+
-+-----------+----------------------------------------------------------+-
-- - --
-- - --
-- - --
-- - --
-- - --
-- - --
-- - --
-+-----------+----------------------------------------------------------+-
+-------------------------------------------------------------------------+
B
Boy van Beurden
30-11-2006 12:17
OKé ma kun je ef rustig uitleggen wat ik moet doen, ben noob hier in dus..:$
B
Boy van Beurden
30-11-2006 13:33
het helpt niet Bart ik heb nu dit:
#container {
			background-color: #acacac;
			width: 430px;
			float: right;
			color: #646464;
			text-align: left;
			border: 2px solid #000000;
			margin-right: 144px;
			margin-left: 0px;
}

#menu {
			width: 170px;
			background-color: #acacac;
			color: #000000;
			float: left;
			border: 1px solid #000000;
			text-align: center;
}


en als ik mijn venster verklein dan gaat mijn container mee en mijn header ook:) mischien ligt het ook daaraan? iemand de commands voor mij?
Jan Koehoorn
30-11-2006 14:37
Dit lijkt er al wat meer op:
CSS

/* OPMAAK TEKST EN BODY */

body {
        background: #cfcfcf;
        color: #646464;
		margin: 0px;
}

a {
        text-decoration: none;
        color: #646464;
}

a:hover {
        text-decoration: underline;
}

/* HEADER */
#header {
	margin: 0px auto;
	width: 430px;
	height: 150px;
	background-image: url('../images/header.jpg');
	border: 2px solid #000000;
	background-repeat: no-repeat;
	color: #ffffff;
}

#hr {
        border: 1px;
        color: #ffffff;
}

#millshot {
        float: left;
        padding-right: 40px;
}

#volgjemij {
        float: right;
        padding-left: 40px;
        height: 25%;
        width: 25%;
        margin: 15px;
}

/* OPMAAK BLOKKEN */

#container {
            background-color: #acacac;
            width: 430px;
            top: 17px;
            color: #646464;
            text-align: left;
            border: 2px solid #000000;
            margin: 10px auto;
}

#menu {
	margin-left: 200px;
	margin-bottom: -90px;
}

En je HTML (je had geen HTML tags, geen DOCTYPE en geen HEAD tags!!)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	<title>Untitled Document</title>
	<style type="text/css">
		@import 'test.css';
	</style>
</head>

<body>
	<div id="header">
		<h1>header</h1>
	</div>

	<div id="menu">
    	<a href="index2.htm">Home</a><br>
	    <a href="index2.htm">statistieken</a><br>
	    gastenboek beheer<br>
	    verslagen beheer<br>
	</div>
	<div id="container">
		<h1>container</h1>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
		<p>tekst</p>
	</div>	
</body>
</html>
B
Boy van Beurden
30-11-2006 16:03
En je HTML (je had geen HTML tags, geen DOCTYPE en geen HEAD tags!!)

Ik had alleen de tekst tussen <body></body> gekopieerd ;)
Thnx.
Maar dan het volgende probleem in mijn menu, mijn links doen het alleen in Firefox en niet in IE :)

Reageren

Inloggen om te reageren