Scripts - Tutorials - Forum - Downloads - Showcase - Contact

Artikels

VPN vergelijken

Algemeen

Beginpagina

FAQ

Grafische worm (243)

Links

Nieuwsartikels

Nieuwsarchief

Boeken programmeren

Overzicht

Samenwerken

Webhosting

Zoek op Sitemasters

Leden

Registreren

Ledenlijst

Ons team

Links

webhostingtop10.be

Sociale media

Follow @sitemasters

Sitemasters

Adverteren op Sitemasters?

Contacteer ons

RSS

Link naar ons

Donaties

Poll

Je moet ingelogd zijn om te stemmen.

Statistieken

Linkpartners

Forum

Categorieën > HTML & CSS

layout met CSS (Opgelost)

jri123 - 20/04/2008 18:51 (laatste wijziging 20/04/2008 18:56)

Nieuw lid

Hallo

Ik heb de opdracht gekregen een layout te maken met CSS.

Heb al verschillende dingen geprobeerd maar het wil maar niet lukken om mijn layout te vervolledigen. Ik hoop dat iemand me kan helpen..

webs.hogent.be/joerib is de layout in XHTML maar ik zou deze in CSS moeten krijgen..

Ik werk met een externe CSS file voor de opmaak.

Het probleem dat ik heb is dat ik mijn div's niet op de correcte plaats krijg.

Code in HTML:

html4strict code - Bekijk de code zonder highlighting - Klap code in

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Layout met CSS</title>
<link rel = "stylesheet" type="text/CSS" href="layout.css"/>
</head>
<body>
<div id="hoofding"></div>
<div id="linkerkolom"></div>
<div id="inhoud"></div>
<div id="voettekst"></div>
</body>
</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Layout met CSS</title>
<link rel = "stylesheet" type="text/CSS" href="layout.css"/>
</head>
<body>
<div id="hoofding"></div>
<div id="linkerkolom"></div>
<div id="inhoud"></div>
<div id="voettekst"></div>
</body>
</html>

En wat er in mijn CSS-file staat:

css code - Bekijk de code zonder highlighting - Klap code in

                div#hoofding
{
width: 800px;
height: 100px;
background-color: black;}

div#linkerkolom
{
width: 200px;
height: 450px;
background-color: green;
float: left;}

div#inhoud
{
width: 600px;
height: 450px;
background-color: blue;
position:fixed;}

div#voettekst
{
width: 800px;
height: 50px;
background-color: red;}
            
div#hoofding
{
width: 800px;
height: 100px;
background-color: black;}
 
div#linkerkolom
{
width: 200px;
height: 450px;
background-color: green;
float: left;}
 
div#inhoud
{
width: 600px;
height: 450px;
background-color: blue;
position:fixed;}
 
div#voettekst
{
width: 800px;
height: 50px;
background-color: red;}
 

Hoping for some feedback

Citaat:

Rens edit:
Feedback nr 1: Codetags gebruiken!

2 antwoorden

Gesponsorde links

Martijn - 20/04/2008 19:02
Crew PHP		wat je moet doen is een div maken om #linkerkolom en #inhoud. html4strict code - Bekijk de code zonder highlighting - Klap code in <div id="hoofding"></div> <div id="extra"> <div id="linkerkolom"></div> <div id="inhoud"></div> </div> <div id="voettekst"></div> <div id="hoofding"></div> <div id="extra"> <div id="linkerkolom"></div> <div id="inhoud"></div> </div> <div id="voettekst"></div> optie 2: alles in 1 #container div zetten, dan overal position: Absolute; bij zetten, en dan met top: 123px; left: 456px; bepalen hoever ie van de linkerbovenhoek moet van de container. de container zet je in het midden door te doen: margin: 0px auto;

jri123 - 20/04/2008 19:23 (laatste wijziging 20/04/2008 19:41)
Nieuw lid		Ok, het werkt, nu nog het geheel in het midden van mijn pagina krijgen. Zou iemand mij daar kunnen mee helpen? Citaat: Rens edit: Volgens de regels spreken we hier nog altijd Algemeen Nederlands. MSN taal valt daar dus niet onder!

Gesponsorde links

Dit onderwerp is gesloten.

Actiefste leden van de maand

Actieve forumberichten