centering my menu tabs

D

dollars

New Member
Hi All,

I have set up a good looking menu tab on my website but I am having a lot of trouble centering the menu tabs on the screen. At the moment it is left aligned and looks crap if your screen resolution is 1024 x 768 pixels

http://www.wealthguide.com.au/

I designed the website in X Site Pro (heaps easier to learn then Dreamweaver) and I have pasted the code for the < head > and < body > in a special section for scripts. In this section for scripts there is no design view where i can just click on the center button (I wish haha). The menu tabs look great and work perfectly, only problem is I can't center them.

Therefore i need to add some code (i am guessing < align = center >) and paste it into the correct position in the code.

Does anyone have any ideas of what I need to do?

Thanks for your help,

Dollars :eek:
 
Q

qadisha

New Member
Position of menu bar

I would try taking float: left; out of these two items:
#tabs10 a {
float:left;
background:url("tableft10.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
text-align:center;
}
#tabs10 a span {
float:left;
display:block;
background:url("tabright10.gif") no-repeat right top;
padding:5px 15px 4px 6px;
text-align:center;
color:#FFF;
}
I noticed you have a <p> in the <head> section. This should come out and be put in the <body> and it should be closed by a </p>.

Also in Firefox, there's a big problem with the 3 small pictures coming up over the menu bar.

I would certainly recommend learning HTML and CSS. In the meantime perhaps Zkiller will come to tell you what's wrong as I'm no expert.
 
D

dollars

New Member
thanks gadisha for your help. I have tried experimenting by removing the float, and also by changing it to center instead of left. Unfortunately it either made it worse or it didnt make any difference.

I agree with you that i should learn CSS, but to be honsest I dont have the time or motivation to study it, and that is the reason I asked for help on this forum.

I had a look in firefox and ur right it looks terrible on that browser, thanks for alerting me to that. Not sure how i can fix that either.

Looks like i need some expert help to clean up the head section of my website.

Can anyone help me, would be grateful.

Thanks,

Dollars
 
Q

qadisha

New Member
Lay-out problems

Hallo Dollars, I just had another look at your code and saw that further down the page you have masses <style> details which should all come into the <head> section. Also, they seem to duplicate each other, so prune out all the duplications.

<div></div>, <p></p>, <table></table>: these all come in the body section. Be careful to close div's p's and also your <li> must be closed by a </li>.

<table> has to be followed by <tr> (table row) and <td> (table cell). You can have a number of rows and cells, of course, but they all need closing.

These are just a few things to be going on with !

I can assure you it is MUCH simpler with some clean HTML code and CSS, abandon your website WYSIWYG software, take the time and it will reward you.
 
Q

qadisha

New Member
Alignment problems

Trying fixing the width of <body> something like this:
body{
width: 760px;
text-align: center;
margin-left: auto;
margin-right: auto;
background-color: black;
}

margin-left: auto; and margin-right: auto; tell Firefox to center your page.
text-align: center; tells IE to center it.

Then your menu tabs should be in a <div align="center>
unless it is the exact width of your body in which case it presumably wouldn't matter if it's not centered.

By the way, from what I've learnt the CSS float is only when you have, for instance, two sections arranged across your page and there are certain rules which apply, such as fixing the width of each section, and the margin of the main section and floating one section to the left or the right. You seem to have float in almost every style statement which is superfluous and might be messing up the lay-out.
 
D

dollars

New Member
looks heaps better now

thanks for your help gadisha - after a lot of effort i managed to fix it up and learn some things in the process. Your code was very useful!

One thing i did notice though was that in IE the body section seems to be aligned right (or there is a blank margin on the left) and in firefox it was aligned left (with a resolution of 1024 x 768)
I would prefer the body section to be centred in both browsers.

Would you or anyone else have any ideas to fix this ??

http://www.wealthguide.com.au/

thanks heaps

dollars
 
You must log in or register to reply here.
Top