How to center this site?

liunx

Guest
This is my first attempt at CSS and I built this website while learning CSS.
I would like to have it centered with the current code which I guess is a total mess.

Can you guide me through the right direction? How can I have the site centered without having to make too much changes in the code?

Website (<!-- m --><a class="postlink" href="http://masa.intnet.mu">http://masa.intnet.mu</a><!-- m -->)To centre the page, do this : div.container {
width:760px;
position:relative;
margin:auto;
background-color: #ffffff;
}
Then add a complete DTD to the top of your page. Try this one : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" " <!-- m --><a class="postlink" href="http://www.w3.org/TR/html4/strict.dtd">http://www.w3.org/TR/html4/strict.dtd</a><!-- m -->
Then change your menu. It's terrible. You really don't need all that javascript for a little menu. You can do the same kind of thing with minimal js and that script is only needed for IE - good browsers don't need any script for it to work. Look at this example : <!-- m --><a class="postlink" href="http://www.htmldog.com/articles/suckerfish/dropdowns/example/vertical.html">http://www.htmldog.com/articles/suckerf ... tical.html</a><!-- m --> then read this : <!-- m --><a class="postlink" href="http://www.htmldog.com/articles/suckerfish/dropdowns/">http://www.htmldog.com/articles/suckerfish/dropdowns/</a><!-- m -->

Good luck.You rock! Excellent links!
The reason I chose this JS menu was because of the time delay it offered for the submenus to stay visible. When browsing a website, I've often found it irritating when a submenu keep disappearing when you move your mouse away.

I haven't tried the code yet - will do it as soon as I get home - but will that work even if I used absolute positioning with every div on the site?I think it'll work because it's the container. It will screw up your js menu though. As for the time delay thing... the trade-off really isn't worth it. Try turning off javascript and then looking reloading your page. You'll find your menu's disappeared. The same won't happen with the menu I pointed you to - the worst that will happen is the submenus won't appear in IE.Doesn't work.


Does absolute positioning cancel a relative positioning?

If so, then the other DIVs in aboslute would be only positioned according to the browsers origin point and not the centered container in relative positioning?Right... Well, that'll probably be because you didn't do what I said...
It's centred in Firefox. I'm guessing you're looking at it in IE and it's not centred because you didn't add the DTD.I've added the DTD but the page doesn't seem to be HTML 4.01 Strict. I am removing the formatting elements and use CSS instead, but don't know ow to deal with the <input> tag.

The graphics don't appear anymore. Is that because the DTD changed?You have lots of inline styles that look kind of like this : <div class="container3" style="width: 267; height: 185">
267 pigs? 185 chickens? You need to tell it what you want (I'm guessing 'px'...)
This kind of thing : <font size=" 2"> is deprecated and should not be used. Use CSS to set font sizes and colours.
When you give values in html, you need quote marks...
Instead of this : <input type=hidden name=ie value=UTF-8> try this : <input type="hidden" name="ie" value="UTF-8" />

By the way... wow, the page is a real mess now, isn't it? I don't think that's my fault by the way - if you'd been coding properly from the beginning, you'd have been OK.By the way... wow, the page is a real mess now, isn't it? I don't think that's my fault by the way - if you'd been coding properly from the beginning, you'd have been OK.

I'm never meant to say that was your fault. On the contrary, 'm very thankful for your help.
I know the code is in a real mess, that's only my first website in CSS.
That was just a way to ask how to solve this mess. I guess I'll have to get deeper in the tutorials and re-write the code. I'll put the previous code back so that people can browse the site in the meantime while rewriting the code.
 
Back
Top