Gå til innhold

Får ikke meny til venstre [tråden er LØST]

Mr. President™

Anbefalte innlegg

Mr. President™

Mr. President™

Skrevet
Skrevet (endret)

Hei. På denne videon så skal man få float menyen til venstre og innholdet til høyre. Men det skjer ikke alt sammen er likt.

 

HTML dokument koden:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
	"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Hjemmeside</title>
<link type="text/css" rel="stylesheet" media="all" href="stil.css">
</head>

<body>
 <div id="main">
		<div id="header">
			<img src="serverpc.png" alt="Hjemmeside Logo">
		</div>

		<div id="navigation">
			<h2 class="nav-title">Meny</h2>
			<ul>
				<li> <a href="hjemmeside.htm" title="Hjem">Hjem</a></li>
				<li> <a href="om-meg.htm" title="Om Meg">Om Meg</a></li>
			</ul>
		</div>
		<div id="main-content">
			<h1>Velkommen til hjemmesiden min</h1>

			<p>Dette er en liten test side. Har akkuratt begynt på denne siden</p>
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vitae libero eu augue dapibus rhoncus vitae quis mauris. Suspendisse potenti. In in risus erat. Mauris placerat sapien et tellus volutpat eget placerat nulla mattis. Praesent laoreet ligula nec sem tincidunt at tincidunt magna vestibulum. Integer malesuada ligula a turpis interdum ac porttitor mauris cursus. Praesent vestibulum libero a eros egestas vitae auctor dolor lacinia. Mauris sagittis vehicula sodales. Cras non nibh adipiscing sapien volutpat porttitor. Quisque adipiscing tempor tellus sed tempor. Proin vulputate, neque in suscipit vestibulum, urna ante lacinia metus, vitae posuere odio justo quis dui. Donec feugiat nisi vitae nisi fermentum vitae tristique elit rhoncus. Maecenas dictum felis ultricies tellus gravida pulvinar. Nunc neque turpis, fringilla nec viverra et, interdum at ipsum.</p>
			<h2 class="title">Integer a enim turpis</h2>
			<p>Integer a enim turpis, nec pharetra urna. Sed porta cursus massa eget laoreet. Integer at justo eu nisl consectetur hendrerit. Sed magna orci, consequat ac venenatis nec, placerat ut risus. Morbi imperdiet porttitor dictum. Nullam et risus vitae urna ornare pellentesque et id lectus. Aenean eleifend faucibus porta. Nunc egestas justo sit amet risus facilisis quis venenatis tortor tempus. Maecenas ac urna turpis, eu pulvinar augue. Nam in arcu vitae leo dignissim vulputate.</p>

			<p>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed in metus lacus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut neque elit, bibendum eu consequat et, tincidunt vel tortor. Nunc eu erat nec turpis congue lacinia vestibulum sed tortor. Vivamus interdum aliquam mattis. Vivamus vitae convallis mi. Pellentesque turpis nisi, sollicitudin sed faucibus sollicitudin, rutrum id felis. Suspendisse elementum rhoncus dui, sed cursus urna aliquet id. Aenean eu nibh sit amet nulla tristique porttitor. Maecenas consectetur, lacus in condimentum facilisis, magna mi vehicula tellus, vitae dapibus mauris nisl ac sem. In accumsan, nulla ac condimentum imperdiet, elit ante interdum sem, sed imperdiet orci libero id neque. Suspendisse sollicitudin, nisl eu viverra pellentesque, urna dolor rutrum lectus, id feugiat sem leo vitae urna. Nam neque lectus, facilisis hendrerit ornare id, consectetur vel felis. Donec vestibulum interdum gravida. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
			<h2 class="title">Aenean orci augue</h2>
			<p>Aenean orci augue, consequat vitae faucibus a, sodales mattis velit. Aenean in diam elit, non tristique risus. Morbi semper luctus orci sit amet tristique. Vivamus tristique aliquet velit eget aliquam. Praesent magna purus, iaculis non auctor eget, suscipit at nulla. Proin in fringilla leo. Pellentesque feugiat ante in libero imperdiet eget facilisis massa accumsan. Ut commodo scelerisque luctus. Sed pretium eleifend ipsum, cursus feugiat enim feugiat et. Aenean molestie purus et lorem egestas suscipit. Maecenas accumsan elit eu ipsum porta imperdiet.</p>

			<p>Phasellus fringilla rutrum scelerisque. Donec in blandit arcu. Praesent egestas fringilla scelerisque. Vivamus lobortis semper massa nec rhoncus. Nulla facilisi. Cras adipiscing, justo vitae viverra vestibulum, purus erat volutpat neque, eget facilisis felis neque vitae nisi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque dapibus lorem ac quam sollicitudin at mollis augue ornare. Morbi sed felis nec metus elementum rhoncus. Suspendisse tempus magna non dui ultricies blandit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed in nisi id dolor ullamcorper egestas. Phasellus at erat massa, vel placerat purus. Vivamus eros arcu, cursus eget lobortis vitae, egestas vel sem. Maecenas quam sapien, tincidunt ut porttitor vel, tempor ut mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce aliquam blandit dolor, eget ullamcorper justo elementum eget. Morbi ac purus a mauris volutpat ornare. Curabitur id turpis dui. Phasellus lobortis cursus nisi, ut placerat eros scelerisque sit amet. </p>
		</div>
 </div>


</body>
</html>

 

CSS filen:

 

 

div#main {
	width: 750px;
	margin: 0 auto;
}

h2.nav-title {
color: red;
}

h2.title {
color: blue;
}

h2.nav-title,
h2.title {
font-size: 25px;
}

div#navigation {
width: 220px
float: left;
}

div#main-content {
width: 500px
float: left;
}

Endret av xDestiny10x
Lenke til kommentar

Videoannonse

Videoannonse
Annonse

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste

  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...