/    Sign up×
Community /Pin to ProfileBookmark

Div Layer Alignment

Hiya im new to webpage design and have done up something simple in dreamweaver but could not get the div layer to be centralised across all resolutions…

My Code:

[QUOTE]

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN”
http://www.w3.org/TR/html4/strict.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml“>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<title>TipsEmpire.Net</title>
<link href=”style.css” rel=”stylesheet” type=”text/css” />

<body>
<div style=”margin:auto; text-align:center; width:783px”><div id=”Layer2″><img src=”../../Documents/Downloads/partytime/images/frame.gif” width=”791″ height=”759″ />
<div id=”Layer3″>
<object classid=”clsid?27CDB6E-AE6D-11cf-96B8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0” width=”766″ height=”270″>
<param name=”movie” value=”../../Downloads/TipsEmpire/images/headermv.swf” />
<param name=”quality” value=”high” />
<embed src=”../../Downloads/TipsEmpire/images/headermv.swf” quality=”high” pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” width=”766″ height=”270″></embed>
</object>
</div>
</div>
</div>
</body>

</html>

[/QUOTE]

[QUOTE]

body{
background:url(images/background.jpg) 0 0 no-repeat;
}
#Layer1 {
position:relative;
width:200px;
height:872px;
z-index:1;
left: 217px;
top: 3px;
}
#Layer2 {
position:absolute;
width:783px;
height:751px;
z-index:1;
left: 328px;
top: -2px;
}
#Layer3 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 11px;
top: 8px;
}

[/QUOTE]

Any advise?? Thanks ?

to post a comment
HTML

3 Comments(s)

Copy linkTweet thisAlerts:
@FangJan 22.2009 — &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;title&gt;Basic centering&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt;

&lt;style type="text/css"&gt;
body {text-align:center;}
#container {margin:0 auto; width:791px; text-align:left; border:1px solid red;}

&lt;/style&gt;

&lt;/head&gt;
&lt;body&gt;
&lt;div id="container"&gt;
&lt;img src="../../Documents/Downloads/partytime/images/frame.gif" width="791" height="759" /&gt;
&lt;object classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="766" height="270"&gt;
&lt;param name="movie" value="../../Downloads/TipsEmpire/images/headermv.swf" /&gt;
&lt;param name="quality" value="high" /&gt;
&lt;embed src="../../Downloads/TipsEmpire/images/headermv.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="766" height="270"&gt;&lt;/embed&gt;
&lt;/object&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;

http://www.bobbyvandersluis.com/index.html
Copy linkTweet thisAlerts:
@DarkleashauthorJan 22.2009 — hey Thanks Alot, it works....? btw i got a question that is how do i know how much width px to put for different design sizezes??
Copy linkTweet thisAlerts:
@FangJan 22.2009 — In this case the width of the widest item, the image.
×

Success!

Help @Darkleash spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...