View Full Version : having problems centering my site.

07-12-2007, 09:45 PM
I'm making a web page in dream weaver and am having problems centering my page. In the past, I have used apdiv layers. Using this it is very very easy to place things on my site, things can overlap, and its extremely easy to put together.

My questions, is there a way to have everything on the page centered, while using apdiv layers. If not what is the best way to center my page? I'm using tables, and it seems impossible to have text over an image when using tables. Can tables overlap? How can I have text over an image thats inside of a table?

Please help, thank you.

07-12-2007, 09:47 PM
Can't help you without a link to your site or your code and the CSS. A link would be better. Help us help you. We aren't psychic.

07-12-2007, 09:59 PM
I'm asking a general question, from scratch...

07-12-2007, 10:04 PM
Okay then. Yes don't use position:absolute if you don't have to. You almost never have to. You should use a containing element around your code and then use margin:auto; to center it.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
html, body {
#container {
margin:auto; /* this won't work in IE if you don't have a valid full doctype */
width:780px; /* change this width to suit your needs */

<div id="container">
<!--rest of code here-->

You also shouldn't be using tables for page layout. Read the link in my sig titled "Why Tables for Layout is Stupid?". To get text over an image you must set the image as a background image.

07-12-2007, 10:12 PM
so there is no other way to put text over an image, unless its the background image? If I use apdiv layers i can, it just wont be centered correctly. I can create a whole site EXACTLY how I want it using apdiv layers, but it just wont be centered correctly. Is there a way to do this?

07-12-2007, 10:13 PM
What the heck is an apdiv? Explain to us what you think it might be.

07-12-2007, 10:23 PM
Open dream weaver, click the insert tab, then layout objects, then apdiv. It gives you a little blue box, where you can move anywhere, and insert any content.

07-12-2007, 10:36 PM
Ahh. Okay. Yeah that uses absolute positioning. Absolute positioning is NOT the way to go when designing a layout. Most layouts require little or NO absolute positioning. You should take the time to actually learn HTML/CSS so you don't have to rely on a program to do the work for you.

If you really don't care then you shouldn't be coding web pages but a simple fix would be to still do what I said to do except make the #container position:relative. The absolute positioning will use the nearest relative parent element to use as a reference rather than using the browser window.

07-12-2007, 11:19 PM
I have to agree with Aero. I've started to see the light recently with respect to AP DIVs. And crj900, if you think it looks "exactly" right, trying zooming in on it with IE's (admittedly lousy) Zoom function. Your Divs will split apart like a puzzle. AP is easier to implement but the end results are lower quality when taking all browsers into account.

With Aero's help I just got my site redesigned using default (static) positioning and it flows / degrades / works much better, even though it took some extra effort to get it done vs. AP layouts.

07-13-2007, 06:19 AM
Try applying this code to fully center your site.

<style type="text/css">
position: absolute;
left: 50%;
top: 50%;
width: 500px;
height: 500px;
margin-left: -250px; /* always half of width - go figure */
margin-top: -250px; /* always half the height - go figure */

Of course - it only works if you your width and height - though you can disgard the height section [margin-top, height attributes] if you don't care about it being fully positioned.

07-14-2007, 09:41 PM
....You also shouldn't be using tables for page layout. Read the link in my sig titled "Why Tables for Layout is Stupid?". To get text over an image you must set the image as a background image.

Hey Aerospace, thanks for the tips on tables, I am looking to re-do my site and will consider using your tips!