Forum Moderators: not2easy
i've been working my behind off to get this webpage working, but i'm getting nowhere.. it's a schoolproject i have to finish before wednesday so i hope you can help me out soon..
<snip>
problem 1)
the menu is scripted in a div. in explorer it aligns perfectly on the right side. in firefox it doens't. same script, different lay-out... can't find the problem
script of div:
<div id="navbar">
<table class="buttons" border="0" cellpadding="0" cellspacing="0">
<tr>
<?php
print "<td class=\"link1\">".knop("home","1")."</td>";
print "<td class=\"link1\">".knop("nieuws","2")."</td>";
print "<td class=\"link1\">".knop("diensten","3")."</td>";
print "<td class=\"link1\">".knop("werkwijze","4")."</td>";
print "<td class=\"link2\">".knop("organisatie","5")."</td>";
print "<td class=\"link1\">".knop("contact","6")."</td>";
print "<td class=\"link2\">".knop("testimonials","7")."</td>";
?>
</tr>
</table>
</div>
script of css:
div#navbar {
height: 22px;
background-color: #FFF;
margin-right: auto;
margin-left: auto;
text-align: right;
}
table.buttons {
width: 500px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
}
table.buttons td.link1 {
text-align: right;
}
table.buttons td.link2 {
text-align: right;
}
problem 2)
there's also a small rectangular banner scripted in a div on the bottom-right. basically beneath dynamic content div. i want this one to 'stick' against the footer instead of floating somewhere underneath the content div.
script div:
<div id="container">
<div id="header">
</div>
<div id="navbar">
</div>
<div id="content">
<div id="left">
</div>
<div id="right">
</div>
<div id="rightbelow">
</div>
<div id="footer">
</div>
</div>
</div>
script css:
div#container {
width: 690px;
height: 800px;
margin-left: auto;
margin-right: auto;
}
div#header {
background-color: #FFF;
height: 70px;
width: 690px;
margin-right: auto;
margin-left: auto;
}
div#navbar {
height: 22px;
background-color: #FFF;
margin-right: auto;
margin-left: auto;
text-align: right;
}
div#container div#content {
background-color: #FFF;
width: 670px;
margin-right: auto;
margin-left: auto;
padding-top: 0px;
padding-right: 10px;
padding-bottom: 10px;
padding-left: 10px;
}
div#container div#content div#left {
background-color: #FFF;
width: 165px;
float: left;
padding: 10px;
margin-top: 10px;
text-align: center;
}
div#container div#content div#right {
background-color: #FFF;
width: 485px;
margin-left: 185px;
margin-top: 0px;
min-height: 402px;
padding: 0px;
}
div#container div#content div#rightbelow {
background-color: #FFF;
position: relative;
width: 485px;
margin-left: 185px;
padding: 0px;
}
div#container div#content div#footer {
clear: both;
background-color: #FFF;
width: 670px;
height: 50px;
text-align: center;
}
if there's anything more you need, please let me know!
hope you guys can help me out!
thanks a million!
[edited by: engine at 7:29 am (utc) on April 14, 2008]
[edit reason] No URLs, thanks. [/edit]
Develop in FF (or safari/opera) get it working there, test in IE later.
IE has conditional comments to allow you to fix for it's broken ways.
E.g. IE uses a broken box model (the width is applied incorrectly)
Also take a look at your actual code generated by php instead of the code generating it. E.g. for your buttons: "knop()" means nothing to CSS, the actual html generated is what CSS cares about.
anyone else on the div positioning?
