|
|
Post a Project »
Find a Professional HTML Freelancer!
Find a Freelancer to help you with your HTML projects
| |
|
Overlapping, Table Allignent, Possible css problem, unsure...
08-28-2006, 02:46 PM
|
Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 6
|
Hi, i recently paid for some php and mysql coding/css/html/etc for my online gaming team....
the website link is: Dishonor Elite
well the person i hired finished the site and now i cant get in touch with him!
i fount out that my problem isnt php, and it comes down to the formatting of the coding and possible the css!
the problem is that on older browsers ex:IE6 and even my up-to-date firefox, the content of the site is overlapping my nav bar which is in php (header.php)
this problem occurs on every page except for my forums.
here is a link to a picture showing what i mean :
here is the code for my header.php, which i think the problem is located in, also gonna attatch my css:
Code:
<?define('IN_PHPBB', true);
$phpbb_root_path = './forum/';
include($phpbb_root_path . 'extension.inc');
include($phpbb_root_path . 'common.'.$phpEx);
//
// Start session management
//
$userdata = session_pagestart($user_ip, PAGE_PROFILE);
init_userprefs($userdata);
//
// End session management
//?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Dishonor Elite</title> <link rel="stylesheet" type="text/css" href="css/de.css"> <script type="text/javascript" src="de.js"></script> </head> <body> <div id="siteContainer"><?php $dEuser = $userdata['username']; $dEsid = $userdata['session_id']; if ($dEuser == "Anonymous") { echo " <div style=\"width: 450px; text-align: center; z-index: 20; left: 43%; position: absolute; top: 120px\"><form method=\"post\" action=\"forum/login.php\">Login: <input class=\"post\" name=\"username\" type=\"text\"> Password: <input class=\"post\" name=\"password\" type=\"password\"> <input class=\"post\" type=\"submit\" value=\"Login\" name=\"login\" onmouseout=\"this.className='post'\" onmouseover=\"this.className='postOver'\"></form></div>"; } else { echo " <div style=\"width: 200px; text-align: center; z-index: 20; left: 43%; position: absolute; top: 120px\">Welcome <strong>$dEuser</strong>! | <a href=\"http://www.dishonor-elite.com/forum/login.php?logout=true&sid=$dEsid\">Logout</a></div>"; }?> <div id="siteBannerContainer"> <div id="siteBannerParent"> <div id="siteBanner"></div> <div id="naviContainer"> <div id="navi"> <ul> <li><a href="http://www.dishonor-elite.com/index.php">Home</a></li> <li onmouseover="naviClan()"><a href="#">Clan</a></li> <ul id="clanSub" style="display: none; margin-left: 10px"> <li><a href="http://www.dishonor-elite.com/aboutus.php">About Us</a></li> <li><a href="http://www.dishonor-elite.com/matches.php">Matches</a></li> <li><a href="http://www.dishonor-elite.com/members.php">Members</a></li> </ul> <li onmouseover="naviCommunity()"><a href="#">Community</a></li> <ul id="communitySub" style="display: none; margin-left: 10px"> <li><a href="http://www.dishonor-elite.com/chat.php">Chat</a></li> <li><a href="forum">Forum</a></li> </ul> <li><a href="#">Photo Gallery</a></li> <ul id="downloadsSub" style="display: none; margin-left: 10px"> <li><a href="http://www.dishonor-elite.com/demos.php">Demos</a></li> <li><a href="http://www.dishonor-elite.com/wallpapers.php">Wallpapers</a></li> </ul> <li onmouseover="naviSI()"><a href="#">Server Information</a></li> <ul id="siSub" style="display: none; margin-left: 10px"> <li><a href="http://www.dishonor-elite.com/serverinfo.php">Server Information</a></li>
<li><a href="http://www.dishonor-elite.com/teamspeak.php">Teamspeak Server Info</a></li> <li><a href="http://www.dishonor-elite.com/serverstats.php">Live Server Statistics</a></li> </ul> <li><a href="http://www.dishonor-elite.com/challenge.php">Challenge Us</a></li> <li><a href="http://www.dishonor-elite.com/contactus.php">Contact Us</a></li> </ul> </div> <img alt="Dishonor-Elite: Counter-Strike Servers" src="images/cs-servers.png" style="margin-left: 75px"> <ul style="margin-left: 45px; margin-top: 10px"> <li class="blackBold">Counter-Strike Servers:</li> <ul style="margin-left: 10px"> <li style="color: #444444">Public Server:</li> <ul style="margin-left: 10px"> <li>69.65.0.69:27015</li> </ul> <li style="color: #444444">Private Server (Password Protected):</li> <ul style="margin-left: 10px"> <li>205.134.225.224:27015</li> </ul> </ul> </ul> <img alt="Dishonor-Elite: Counter-Strike Matches / Practice" src="images/cs-matches.png" style="margin-top: 20px; margin-left: 65px"> <ul style="margin-left: 45px; margin-top: 10px"> <li class="blackBold">Upcoming Matches / Practice:</li> <ul style="margin-left: 10px"> <li style="color: #444444">To Be Announced</li> <ul style="margin-left: 10px"> <li>Times T.B.A.</li> </ul>
<li style="color:#444444">To Be Announced</li> <ul style="margin-left: 10px"> <li>Times T.B.A. </li> </ul> </ul> </ul> </div> <div id="contentContainer"> <div id="content">
CSS:
Code:
* {
margin: 0;
padding: 0;
}
html, boday {
margin: 0;
padding: 0;
min-height: 100%;
}
body {
overflow-x: hidden;
color: #FFFFFF;
height: 100% !important;
background: url("../images/contentLeft.png") repeat-x;
background-color: #000000;
font-family: Verdana;
font-size: 10px;
margin: 0;
padding: 0
}
a:hover {
border: 0px;
color: #FFFFFF;
font-weight: bold;
text-decoration: none
}
a:link {
border: 0px;
color: #d6ff94;
font-weight: bold;
text-decoration: none
}
a:visited {
border: 0px;
color: #d6ff94;
font-weight: bold;
text-decoration: none
}
a:active {
border: 0px;
color: #FFFFFF;
font-weight: bold;
text-decoration: none
}
.whiteRegular {
font-size: 10px;
color: #FFFFFF
}
.whiteBold {
font-size: 10px;
color: #FFFFFF;
font-weight: bold
}
.silverRegular {
font-size: 10px;
color: #CCCCCC
}
.silverBold {
font-size: 10px;
color: #CCCCCC;
font-weight: bold
}
.blackRegular {
font-size: 10px;
color: #000000
}
.blackBold {
font-size: 10px;
color: #000000;
font-weight: bold
}
#siteContainer {
height: 100%;
margin: 0 auto;
}
#siteBannerContainer {
height: 100%;
margin-left: -399px;
position: relative;
left: 50%;
background: url(../images/contentRight.png) 50% 0% repeat-x;
}
#siteBannerParent {
display: table;
background: url(../images/contentBottom.png) repeat-y;
height: 100% !important;
width: 798px;
}
#siteBanner {
background: url(../images/contentBackground.png) 50% 0% repeat-x;
height: 398px;
width: 798px;
}
#naviContainer {
float: left;
width: 180px;
height: 100% !important
}
#navi {
width: 180px;
padding: 0 0 1em 0;
margin-bottom: 1em;
font-family: "Verdana";
color: #333;
margin-top: -160px;
margin-left: 40px;
}
#navi ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}
#navi li {
margin-top: 5px;
}
#navi li a {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 2px solid #999999;
color: #000000;
text-decoration: none;
width: 100%;
}
html>body #navi li a {
width: auto;
}
#navi li a:hover {
border-left: 10px solid #666666;
background-color: #1f2124;
color: #FFFFFF;
}
#contentContainer {
margin-left: 85px;
margin-top: -180px;
float: left;
width: 500px;
height: 100% !important
}
#content {
width: 500px;
height: 100% !important
}
.contentMessageTitleContainer {
padding-top: 20px;
padding-bottom: 2px;
margin: 0 auto;
width: 450px;
height: 10px;
overflow: hidden;
}
.contentMessageTitle {
float: left;
width: 50%;
height: 10px;
overflow: hidden;
}
hr {
border: 0px;
margin: 0 auto;
width: 450px;
height: 2px;
overflow: hidden;
background-color: #FFFFFF;
}
.contentMessage {
padding-bottom: 8px;
padding-top: 8px;
margin: 0 auto;
width: 450px;
}
#fillOut {
margin: 0 auto;
background: url(../images/contentBottom.png) repeat-y;
height: 100px;
min-height: 100%;
width: 798px;
}
also, some people say that the nav bar only shows a couple of my navigatioon menu "mouse-over" links.
here is a link to a picture showing what i mean :
i love my website, and most content in it ran off of my forum through custom coding. I just wish this problem wouldnt happen to alot of viewers because its such a pretty website, and it doing that is such an eye sore! |
|
|
|
|
08-28-2006, 09:11 PM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 10,017
Location: Tennessee
|
Your menu is definitely screwed up in IE 6, but looks fine in Firefox, although in FF it's operation isn't smooth and a little jumpy.
The problem in IE is what we call "float drop" and it happens when the sum of all the 'boxes' inside a container are too wide to fit in that container, so it "drops" the content down to where it does have room.
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
Please login or register to view this content. Registration is FREE
Please login or register to view this content. Registration is FREE
|
|
|
|
|
08-28-2006, 11:33 PM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 6
|
any possible solutions?
 |
|
|
|
|
08-29-2006, 10:01 AM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 10,017
Location: Tennessee
|
Yes, but I'll have to download your page and dig into the code to find the solution. I was just too tired last night to do that.
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
Please login or register to view this content. Registration is FREE
Please login or register to view this content. Registration is FREE
|
|
|
|
|
08-29-2006, 02:07 PM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 6
|
wow, you would really do that for me?!
i would be so thankful !
let me know what u need from me if anything
-your freind from new orleans,
john rucker
|
|
|
|
|
08-29-2006, 04:24 PM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 10,017
Location: Tennessee
|
I'll give it a shot 
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
Please login or register to view this content. Registration is FREE
Please login or register to view this content. Registration is FREE
|
|
|
|
|
08-29-2006, 06:17 PM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 10,017
Location: Tennessee
|
Ok, I think I've got it solved.
There were a few things not quite right in the html (incorrectly nested lists), I corrected those.
Your friend did a great job on the design -- for standards-compliant browsers. Unfortunately, IE doesn't fall into that category and it seems he didn't account for that.
Rather than posting the code in this reply, I'm attaching the files themselves. You can either go thru them and make the same changes I did, or just replace your existing ones with these. PLEASE, make a backup of your originals first. Even though they aren't quite right for IE users, you should hang onto his original files until you're 100% satisfied that the changes I made are working for you. Make sense ?? I can't test for every browser and screen resolution, so be safe and backup the originals. If these files don't work right, PM me and let me know what's haywire.
__________________
Web Goddess & Web Standards Evangelist :) - Tables Be Gone !!
Please login or register to view this content. Registration is FREE
Please login or register to view this content. Registration is FREE
Last edited by LadynRed; 08-29-2006 at 06:19 PM..
|
|
|
|
|
08-29-2006, 06:51 PM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 6
|
hey i uploaded those files, will pm you
|
|
|
|
|
08-29-2006, 11:02 PM
|
Re: Overlapping, Table Allignent, Possible css problem, unsure...
|
Posts: 6
|
check pm!
sent
|
|
|
|
|
« Reply to Overlapping, Table Allignent, Possible css problem, unsure...
|
|
|
| Thread Tools |
Search this Thread |
|
|
|
Posting Rules
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
|
|
|
|
