Jump to content

The maddness of CSS


username132
 Share

Recommended Posts

Here are links to two pages differing only in one line of CSS. Please view in Firefox/Opera (IE can wait). There are spaces in the URL. This doesn't matter.http://username132.tasminslair.com/Seans%2...es/products.phphttp://username132.tasminslair.com/Seans%2...es/products.phpFor website one;#primary_nav {background: #e3c49c;font-size: 80%;position: relative; top: 70px;margin-left: 175px;/* float: right; *//* height: 25px; */z-index: 3;}For website two;#primary_nav {background: #e3c49c;font-size: 80%;position: relative; top: 70px;margin-left: 200px;/* float: right; *//* height: 25px; */z-index: 3;}Firstly, what IS the bar that occurs behind the menu items? Why aren't there just menu items floating with no bar behind?Secondly, in website two, the bar is moved to the right a bit more as expected. What is not expected is that the bar widens and the menu options are thrown about the place. What causes things like this to happen? CSS really does feel like a descent into maddness!!The rest of the CSS

Link to comment
Share on other sites

Remove this background-color:#primary_nav {background: #e3c49c;and there will no be that bar anymore.If You need get something to the right, please do not use left margin to push those things. Use position as right: 10px; or similar, or text-align: right; those will do the job in #primary_nav.Here is how I test it, and it works fine with all browsers: (Opera MSIE Firefox K-Meleon)

#primary_nav {font-size: 80%;position: relative;top: 70px;right: 0;z-index: 3;}

Link to comment
Share on other sites

Thanks for the advice. Don't get me wrong, I like the bar, I just wondered why it was there. However I want the bar to link all the menu items together without appearing from the left or right ends of the menu i.e. I want;item==item==itemas opposed to;===item==item==item==I've tried changing position: relative; left: but it doesn't do anything. Currently,http://username132.tasminslair.com/Seans%2...es/products.php uses;#primary_nav {background: #e3c49c;font-size: 80%;position: relative; top: 70px; left 9000 px;/* margin-left: 175px; *//* float: right; *//* height: 25px; */z-index: 3;}and the bar wont budge?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...