Design-web.nl forum


Lessen, tutorials en scripts in html, css, javascript, php en mysql.  

All times are UTC + 1 hour




Post new topic Reply to topic  [ 2 posts ] 
Author Message
 Post subject: Divjes positioneren
PostPosted: Mon Jul 26, 2010 10:20 am 
Offline
Newbe

Joined: Mon Jul 26, 2010 10:16 am
Posts: 1
Hallo allemaal,

Ik heb een vraag over hoe ik mijn divjes die ik in mijn body heb staan kan positioneren door middel van CSS. De code's die ik tot nu toe heb zijn:

<!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=utf-8" />
<title>Photography - Welkom</title>
( externe style sheet zet ik hier ff neer maar hij staat bij mij op extern:
#container {
position: absolute;
margin: 0 auto;
width: 897px;
height: 500px;
top: 50%;
left: 50%;
margin-left: -450px;
margin-top: -250px;
}


#logo{
background-image:url(../../afbeeldingen/Template/images/logo.png);
width: 196px;
height: 71px;
}
.box{
background-color:#e70373;
width:240px;
height:250px;
position:absolute;
float:left;
margin:0px;
top:50%;
margin-top:-125px;
}


.box .tl{
background-image:url(../../afbeeldingen/Template/Photography/box_tl.png);
width:13px;
height:13px;
position:absolute;
top:0px;
left:0px;
float:left;
}

.box .bl{
background-image:url(../../afbeeldingen/Template/Photography/box_bl.png);
width:13px;
height:13px;
position:absolute;
bottom:0px;
left:0px;
float:left;
}

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


.menu1{
top:30px;
position:relative;
background-image:url(../../afbeeldingen/Template/images/hoofdmenubutton.png);
background-repeat:no-repeat;
width: 209px;
height: 40px;
margin-left:15px;
padding-left:10px;
padding-top:26px;
color:#FFF;
font-size:14px;
font-family:"Arial Rounded MT Bold", "Arial Black";
float:left;
}

.menu2{
top:30px;
position:relative;
background-image:url(../../afbeeldingen/Template/images/hoofdmenubutton.png);
background-repeat:no-repeat;
width: 209px;
height: 40px;
margin-left:15px;
padding-left:10px;
padding-top:26px;
color:#FFF;
font-size:14px;
font-family:"Arial Rounded MT Bold", "Arial Black";
float:left;
}

.menu3{
top:30px;
position:relative;
background-image:url(../../afbeeldingen/Template/images/hoofdmenubutton.png);
background-repeat:no-repeat;
width: 209px;
height: 40px;
margin-left:15px;
padding-left:10px;
padding-top:26px;
color:#FFF;
font-size:14px;
font-family:"Arial Rounded MT Bold", "Arial Black";
float:left;
}

.content{
background-image:url(../../afbeeldingen/Template/Photography/tekst_vak.png);
width:657px;
height:205px;
position:absolute;
float:right;
margin:0px;
top:50%;
margin-top:-102px;
}

.content .top{
background-image:url(../../afbeeldingen/Template/Photography/tekst_kop.png);
width:657px;
height:66px;
top:0px;
float:right;
margin:0px;
top:50%;
margin-top:-33px;
}

.content .bottom{
background-image:url(../../afbeeldingen/Template/Photography/tekst_bottom.png);
width:657px;
height:66px;
float:right;
margin:0px;
top:50%;
}

.content .tekst{
padding-left:25px;
padding-right:15px;
font-size:12px;
font-family:"Arial Rounded MT Bold", "Arial Black";
color:#FFF;
}

#menu{
background-color:#3C6;
width:657px;
height:24px;
float:right;
}




</head>

<body bgcolor="#999999">
<div id="container">
<div id="distance">

<div id="logo"></div>

<div id="menu">Welkom</div>

<div class="content">
<div class="top"></div>
<p class="tekst">Wij helpen onze opdrachtgevers hun organisatie en medewerkers te ontwikkelen en te versterken. Wij leveren aantoonbare bijdragen aan succes. Wij onderscheiden ons inonze werkwijzen door nieuwe en beproefde methoden en technieken tot innovatieve aanpakken te combineren.
Wij zijn sterk in de begeleiding van veranderingsprocessen. Wij gebruiken hierbij o.m. Large Group Interventions die het mogelijk maken velen, zo niet alle belanghebbenden bij het proceste betrekken. Door onze manier van werken krijgen we mensen gemotiveerd in beweging rond een veelheid van organisatie vraagstukken. Vraagstukken waarop het antwoord niet altijd pijnloos is, maar dat wel draagvlak heeft. Omdat het is geformuleerd met gebruik van de kennis, ervaring en het perspectief van iedere belanghebbende medewerker. Met behulp van een transparant proces.</p>
<div class="bottom"></div>

</div><!--content-->

<div class="box">
<div class="menu1">Photographics</div>
<div class="menu2">Graphics</div>
<div class="menu3">Special futhers</div>
<div class="tl"></div>
<div class="tr"></div>
<div class="bl"></div>
<div class="br"></div>
</div><!--box-->

</div>
</div><!--container-->
</body>
</html>


Nu is het probleem dat mijn content ( top en de bottom ook ) niet naar rechts gaan en niet luisteren naar float right.

Hoe is dit mogelijk?


Top
 Profile  
 
 Post subject: Re: Divjes positioneren
PostPosted: Fri Aug 27, 2010 9:54 am 
Offline
Administrator

Joined: Fri Mar 07, 2003 2:07 pm
Posts: 1872
Location: Netherlands
Kan je een link geven naar de daadwerkelijke pagina? Zo is het bijna niet voor je op te lossen.

_________________
Fouten in de lessen? Meld ze me via pm of in het daarvoor beschikbare forum en help anderen!

http://www.fourblocks.nl


Top
 Profile  
 
Display posts from previous:  Sort by  
Post new topic Reply to topic  [ 2 posts ] 

All times are UTC + 1 hour


Who is online

Users browsing this forum: No registered users and 1 guest


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
cron