Beste,

Ik heb een HTML code bug, zelf kan ik er niet uitkomen en ook heeft een ander er naar gekeken.

Het probleem is dat, wanneer ik één stuk tekst wijzig, mijn hele menu flipt.

Ik hoop dat jullie er wat fouten in zien, waardoor ik hem kan debuggen.

<!DOCTYPE html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="description" content=":D" />
	<meta name="keywords" content="tijdelijk weggehaald" />
	<meta name="robots" content="index, nofollow">
	<title>Home - HTML</title>
	<link href="css/style2.css" rel="stylesheet" type="text/css" />
</head>
<body>
	<div id="container">
            
		<div id="header">
			<div id="head_logo"><a href="index.html">WebDesign</a></div>
			<div id="slogan">Wees welkom op <font color="orange">WebDesign</font>.</div>
		</div><!-- end header div -->
		
                <div id="content">
			<div id="content_tekst"><h1>Welkom op mijn portfolio.</h1>< 
			<div id="avatar"><a href="#aboutme"><img src="images/no_avatar.jpg" alt="lala" title="lala" /></a></div>
			
                <div id="navBar"> 
                        <ul>
                            <a href="index.html"><li>Home</li></a>
                            <a href="#portfolio" onclick="alert('Momenteel niet aanwezig')"><li>Portfolio</li></a>
                            <a href="#Factuur" onclick="alert('Momenteel niet aanwezig')"><li>Factuur aanvragen</li></a>
                            <a href="Contact.php"><li>Contact</li></a>
                        </ul>
                </div>
                        
		<div id="p_cont">
                                
                <p id='tekst1'>

                <p>
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                </p>
                </p>
                <br/>
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                </p>
                </p>
		</div>
                        
                <p id="tekst3">
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                </p>

                    <a href="Contact.php" style="text-decoration: underline;">Vraag uw site hier aan</a>.
                </p>
                        
                <p id="projecten">Laatste projecten:</p>
                    <div id="projecten_af">
                        <img src="images/thumbs/portfolio.jpg" alt="portfolio" /> 
                        <img src="images/thumbs/name.jpg" alt="name" />
                        <img src="images/thumbs/name2.jpg" alt="name2" /> 
                    </div>
		</div>
            </div><!-- end content_tekst div -->
        </div><!-- end content div -->

    <div id="footer">Copyright &copy; 2012 | <a href="index.php">Mijnaam</a></div>
    
</body>
</html>
Kun je wat specifieker zijn? Welk stukje tekst wijzig je dan?
Als ik dit stukje aanpas:


<div id="header">
			<div id="head_logo"><a href="index.html">WebDesign</a></div>
			<div id="slogan">Wees welkom op <font color="orange">WebDesign</font>.</div>
		</div><!-- end header div -->
		
                <div id="content">
			<div id="content_tekst"><h1>Welkom op mijn portfolio.</h1>< 
			<div id="avatar"><a href="#aboutme"><img src="images/no_avatar.jpg" alt=";p" title=";p" /></a></div>
Ja maar wat pas je dan aan?

De div's?
Alles wat in de div's zit?

Door wat vervang je het dan?
Chris NVT op 24/05/2012 14:44:02

Ja maar wat pas je dan aan?

De div's?
Alles wat in de div's zit?

Door wat vervang je het dan?


Ik delete bijvoorbeeld dit:

<div id="content_tekst"><h1>Welkom op mijn portfolio.</h1>

Dan verspringt mijn avatar en het menu komt onder elkaar te staan. Die staat op: display: inline;

Dat is logisch.

Je laat nu de </div> staan van <div id="content_tekst"> dus je hebt een sluitings tag te veel, wat voor dit soort problemen zorgt.

Gooi ook die </div> eens weg, wat doet hij dan?
Als je dit delete:

<div id="content_tekst"><h1>Welkom op mijn portfolio.</h1>


Dan haal je wel de begin <div> weg, maar niet de eind </div>. Dat gaat dus fout.

[size=xsmall]Toevoeging op 24/05/2012 14:55:29:[/size]

wat Chris dus ook zegt.
Waarschijnlijk omdat je dan de start div eruit haalt, klopt je positionering niet meer.
[offtopic]
edit: spuit 11 x 2
[/offtopic]
Sorry, maar als je even door je code leest zie je al een aantal fouten... Ik geloof niet dat hier goed naar gekeken is...

- je gebruikt font... (IN HTML5 ?!)
font wordt al heel lang niet meer ondersteund, doe dit met CSS
- je sluit de volgende div niet (correct) af
#content_tekst
[edit]sorry, deze wordt blijkbaar veel later afgesloten, maar dan staat er nog steeds een haakje teveel na de </h1>[/edit]

- je zet 'a' om een 'li', dit hoort volgens html semantics andersom...

Dat zijn de eerste drie dingen die mij onmiddelijk opvallen, en na het valideren blijken er ook nog een aantal 'p' elementen in 'p' elementen genesteld...
- je zet 'a' om een 'li', dit hoort volgens html semantics andersom...

Niet alleen semantisch verkeerd maar gewoon altijd verkeerd. Een inline element (a) mag nooit in een block element (li).

Tevens moet je constant blijven. Ga geen dubbele en enkele quotes door elkaar gooien, gebruik gewoon altijd dubbele quotes.

Verder is jou HTML code echt totaal verkeerd. Een paragraph in een paragraph?? Ooit een alinea in een alinea gezien bij een tekst?
Ik zou als je ik jou was je eerst eens gaan verdiepen in de betekenis van alle tags en dan pas weer verder gaan, want hier valt niks mee te beginnen. Sorry dat ik het zeggen moet, maar het is nu eenmaal zo, neem het niet te persoonlijk het is je code die ik afkraak niet jijzelf.

Reageren