PDA

View Full Version : Coding divs in layers


alihandford
12-03-2009, 02:51 PM
Hello, I am using dreamweaver to make divs and I am doing them in layers because it's easy to drag them to where I want them. But when I paste this code onto my webpage the divs aren't like stuck onto the page like I want them to be, so this means the divs change position on the screen according to the viewers screen resolution. Is this because I am using layers? If so, is it possible to still us layers but make it actually stick to my page by changing my coding, like perhaps my css? This is my coding now -

<!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>Untitled Document</title>
<html style="height: 100%;">
<BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR><BR>
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:197px;
height:204px;
z-index:1;
border:#999999 1px;
background-color:#CCCCCC;
}
#apDiv2 {
position:absolute;
width:201px;
height:270px;
z-index:2;
background-color:#CCCCCC;
color:#000000;
left: 220px;
top: 141px;
}

#apDiv3 {
position:absolute;
width:200px;
height:115px;
z-index:2;
background-color:#cccccc;
}
#apDiv4 {
position:absolute;
width:200px;
height:115px;
z-index:2;
background-color:#CCCCCC;
left: 217px;
top: 18px;
}
-->
</style>

<body>
<div id="apDiv2"><font face="ArialMT"><?php if (function_exists("get_mostpopular")) get_mostpopular(); ?></font></div>
<div id="apDiv4">Testing testing testing testing testing</div>
</body></head>
</html>

And this is what it looks like live http://www.lannia.com/inspiration/

Corrosive
12-03-2009, 03:37 PM
You need to use relative positioning for page structure wherever possible. I'm afraid that you lose the drag and drop capability though.

alihandford
12-03-2009, 03:46 PM
Oh ok thank you.

So if I wanted to put divs a long side each other how would I do that in HTML? For example if I wanted two divs like -

X X

Corrosive
12-03-2009, 03:49 PM
Float the first div left using css and the next one will draw up alongside it.

alihandford
12-03-2009, 04:46 PM
Ok thanks, what happens if I want more than two a long side each other. Like if I wanted four divs such as, -

x x x x

Corrosive
12-03-2009, 04:52 PM
You still float them. You can float left or right to get the structure you want.

alihandford
12-04-2009, 07:43 PM
Well thats what I have been doing but it's not working. I need more explanation and an example because I don't understand exactly what you mean?

edbr
12-05-2009, 12:55 AM
this has been answered in
http://www.dreamweaverclub.com/forum/showthread.php?t=34571
this is a double posting of the same question
closing thread

alihandford
12-05-2009, 05:50 PM
Sorry, I don't know how I did that :S?
Anyways thank you for your help my problem is sorted :D

gentleone
12-05-2009, 06:28 PM
my problem is sorted

a 'thank you' in the solved thread would also be nice then ;)