Log in

View Full Version : Resolved Aligning divs



Mirawr
07-03-2011, 04:39 PM
Hello everyone,

I have a problem, obviously.
It's about aligning divs and how to center them.
I've looked it up on many many forums but it seems none of those solutions work for me. I think I've got a conflict somewhere but I can't find it.

First of all, I sliced and auto-coded it with photoshop and then edited the codes. All I want is to have everything centered, mainly the images. I'd rather have the text aligned left. I know this is possible with tables, but how do I do this with divs?

Another thing, if I add
body {
text-align:center;
font-family: arial, helvetica, sans-serif;
font-size: 80%;
color: black;
background-color: #000;
margin: 1em;
padding: 0;
}
In my CSS, it doesn't seem to change anything at all. But if I add this in the actual index.html it does.
I'm doing something wrong, does anyone can point out what exactly? :)
Thanks in advance!
Edit: here's a link for you to look at:

Mirawr
07-03-2011, 07:10 PM
Anyone? I hate double-posting but I really need to work this out, haha

Nile
07-03-2011, 07:21 PM
I don't understand what the problem is on the page you linked to.

You can read the following article on centering things.
http://www.w3.org/Style/Examples/007/center

Also, next time please wait about 24 hours before double posting.

Mirawr
07-03-2011, 07:23 PM
Well, there's a white bar on the right, which indicates that the whole page isn't centered. It's aligned to the left. I want it in the center, then want the bg to be black (which is my second problem because putting:

body {
text-align:center;
font-family: arial, helvetica, sans-serif;
font-size: 80%;
color: black;
background-color: #000;
margin: 1em;
padding: 0;
}

for the black background doesn't seem to work.

Nile
07-03-2011, 07:32 PM
In your css file, get rid of the html markup.

(remove highlighted)

line 2


/* General Styles */
<style type="text/css">
body {
text-align:center;
font-family: arial, helvetica, sans-serif;
font-size: 80%;
color: black;
background-color: #000;
margin: 1em;
padding: 0;
}

lines 317 + 318


#footer_ {
position:absolute;
left:0px;
top:1196px;
width:1200px;
height:56px;
}

-->
</style>


Then find the following code:


#Table_01 {
position:absolute;
left:0px;
top:0px;
width:1200px;
height:1252px;
}


And change it to:


#Table_01 {
position:relative;
margin: -13px auto;
width:1200px;
height:1252px;
}

Mirawr
07-03-2011, 07:40 PM
Thanks a lot, I've been trying to fix that for a few hours now and couldn't fix it.
You're a hero :)

Nile
07-03-2011, 07:46 PM
No problem, I'm glad to help :D

In an effort to keep things organized, you have the option to set a thread to resolved when an issue is fixed. To make the status of the thread resolved:
1. Go to your first post
2. Edit your first post
3. Click "Go Advanced"
4. In the dropdown next to the title, select "RESOLVED"