Hello fellow web designers and developers! This is my first time posting to a forum for help.
Would you please take a look at [URL=”http://www.lifeionizers.com/kangen-vs-life1″]my webpage
It works in browser widths of 1024, but wider browser widths make it move left. I’ve worked on this page for a week, because I’m still a newb, and there are lots of interruptions at work, but I really need a fresh pair of eyes to offer some insight. As far as I know, I have validated as far as I can without messing up a javascript form on the page.
I’m not sure if I should post the CSS, so I’ll do it anyway in case you don’t use Firebug for FF.
I am using absolute positioning, but I suspect the fix is in relative positioning. I already use some relative positioning on my page, so I’m stuck as to how the different divs will relate to each other. Any help you can offer is greatly appreciated!
CSS: These are the elements that I believe will make the difference…this is probably really obvious, but please be gentle with me. I’m relatively new with all of this.
#phone_number {
position:absolute;
left:864px;
top:60px;
width:138px;
height:31px;
z-index:2;
}
#mainnav {
position:relative;
margin-left:75px;
margin-top:139px;
width: 947px;
height:40px;
z-index:1;
}
.kangenvslife1 {
font: 75% Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
text-align: center;
color: #000000;
}
.kangenvslife1 #container {
width: 950px;
margin: 0 auto;
border: none;
text-align: left;
}
HTML (shorthand):
<body class=”kangenvslife1″>
<div id=”container”>
<div id=”mainnav”>
<div id=”phone_number”>
</div>
</div>
</div>
</body>