Newbie in CSS, I have 3 problems (today) with my website that I can't fix :/ You're help would be welcome!
- Do you know why my logo and slogan are not vertically aligned with the horizontal menu? They have both top: 30px in my CSS sheet...
- The width of my page seems to be more than 100% (I can scroll hori-zontally) eventhough I put 100% in the css sheet. This is odd.
- The menu categories (presentation, services, contact) are in the opposite order (looks like this is due to float: right). I can fx it by putting float/left, but in that case the menu is no longer aligned on the right side of the page. Is there a way to fix this?
Try this, place your both logo and menu into the same div, then change your logo and menu float to left, set both of their width to 50%, btw if you change margin or padding, they will get bigger and will not be in the same height anymore, if that happens edit the width for 45% for example.
Also you will need to change the height for the div they place, because if they are floated, they will not change height automaticly.
About that last one, try to change them manually, simply edit the links.
The problem with the nav and logo is your widths on the 2 overlap each other which makes the browsers automatically drop one down a bit to allow room. You need to set a width for the nav div and the logo div. This may require reducing the font sizes or some other adjustment. I only played with this a little bit and I was able to get both to line up with each other by setting the logo at 50% width with a left float and the nav at 40% with a right float. This will get you the results I think your looking for.
Going to look at your other problem now. If I figure it out I'll post another reply for that.
Ok IF you fix you alignment issues of your logo and nav as I suggested in my previous reply, then you should be able to change the float on the buttons to a left alignment there by making them appear in order as you wish. I would not have placed the float on the actual a link I would have placed it on the nav li tag instead but I guess either way will work. Hope I helped some.
As for the width of your page creating a horizontal scroll, your container widths within the body are most likely causing expanding issues making the width larger than the 100%. I did not however, look at this issue.
Reply With Quote
Bookmarks