Jump to content

Menu corrupted in firefox only


Recommended Posts

hi,the website i am working on looks perfect on IE6, opera, konqueror(Linux) but the links are very close and crowded together in firefox only either on windows or linuxthe following link is a zip file contains a html file with only the header of the page and the associated style and two screenshots for the menu on two different browsers on my computerhttp://s1.quicksharing.com/v/7447409/firefox_error.zip.htmli hope i have provided enough information and any help is appreciated

Link to post
Share on other sites

I can see tha t people here do not trust external download files so i will put the code hereThe html code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>REAL ESTATE FREE WEBSITE TEMPLATE</title><meta http-equiv="Content-Type" content="text/html; charset=ar-eg" /><meta http-equiv="content-type" content="text/html; charset=utf-8" /><link rel="stylesheet" type="text/css" href="style_main2.css" /></head><style></style><body><div id="wrapper">      <div id="navbar">	<ul>		<li><a href="index.html">link</a></li>		<li><a href="offers.html">link</a></li>		<li><a href="#">link</a></li>		<li><a href="#">link</a></li>		<li><a href="#">link</a></li>		<li><a href="#">link</a></li>   </ul>   </div>	</div></body></html>

The CSS code

 * {    padding : 0;    margin : 0;  }body {    font-family : Arial, Helvetica, sans-serif;    color : #666666;    font-size : 12px;    direction:rtl;  }#wrapper {    width : 910px;    margin : 0 auto;  }/* navbar */#navbar {    margin : 0 auto;    padding : 5px 5px 10px 5px;    background-color : #224080;  }#navbar ul {    margin : 0;    padding : 0;    list-style : none;    text-align : center;  }#navbar li {    display : inline;    margin-left:5px;  }#navbar a {    padding : 5px 15px;    text-transform : uppercase;    text-decoration : none;    font-size : 20px;    font-weight : bold;    color : #ffffff;    padding : 5px 15px 10px 15px;  }#navbar a:hover {    background-color : #81a2cf;    padding : 7px 15px 10px 15px;  }/* end navbar */

I wish you all safe surfing :)

Link to post
Share on other sites

Do you have a link to the site online where people could see the problem? I'm not sure if it's that people don't trust downloading a file so much as people don't want to have to save stuff and then find it themselves if it is already online somewhere.

Link to post
Share on other sites
Do you have a link to the site online where people could see the problem? I'm not sure if it's that people don't trust downloading a file so much as people don't want to have to save stuff and then find it themselves if it is already online somewhere.
well that's a good point but i would like to tell you that i did not get the correct password for this website until this morning so i thought that the best thing i can do then is to upload a zip file.any way the website is www.elamaar.comthe language is arabic so if the page is corrupted use arabic encoding to view it correctly and i think tha UTF-8 would do a fine job toothe top and the bottom portions of the page are php scripts just to centerlize managmentthe website is made with Quanta plus, blue fish and some notepad like programsjust open this link in firefox and any other browser you will see the differencealso any comments about the site are really appreciated as this is the first day for this site on the web and it really need alot of work to be anything near ready
Link to post
Share on other sites

This class has padding twice:

#navbar a {	padding : 5px 15px;	text-transform : uppercase;	text-decoration : none;	font-size : 20px;	font-weight : bold;	color : #ffffff;	padding : 5px 15px 10px 15px;  }

I'm not sure if that's a problem or not. You might want to specify the padding as important. This rule might be messing up the padding on the menu:

* {	padding : 0;	margin : 0;  }

You can try removing that and see if it fixes the menu, or just make the menu padding important.

	padding : 5px 15px 10px 15px !important;

Link to post
Share on other sites

Thank you very much for your help justsomeguy but unfortunately it did not worki even tried to put a gif with different width sizes but still no luckit seems that the menu refuses to move any where before nearly 350 px from the right side of the menui also tried to change the right and left css values in different classes but still no luck

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...