SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Evangelist venkat6134's Avatar
    Join Date
    Jul 2010
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to fix menu width in IE?

    Hi all,
    I have developed a menu to my site..
    But it is working properly in Mozilla, but not in IE.

    That means the width is increased and one menu category is showing in next line...
    How can i make it to fit into the size as in Mozilla...

    Thanking for your reply..

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,317
    Mentioned
    460 Post(s)
    Tagged
    8 Thread(s)
    You may just have to reduce margins a little, or padding, or widths etc. Do you have a link that we can look at, or a code sample? Then we can see what is going on. Otherwise, we can only make guesses.

  3. #3
    SitePoint Evangelist venkat6134's Avatar
    Join Date
    Jul 2010
    Posts
    454
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanking you for your reply..
    Test this site in IE and Mozilla. you will get the difference.
    Anandsoft Blog

    And when i login into the site, on the top fixed slide bar will shown.
    At that time, sub-level menu is overlapping with the top level menu when i mouse over on the menu..(not showing properly).

    Thank you..

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,514
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    You can't just expect a menu to reach full width because you have tweaked some padding t make it fir in one browser. Text width varies considerably between browsers by as much as 50px on a single line so you cannot just assume that if it first in one browers it will fit in another.

    If you have to have a menu an exact width then you will need to class the individual menu items and give them a pixel width that matches exactly to the space available. You can center the text with text-align:center and no side padding will be needed. This means that wider text will be accommodated because it can expand without causing problem as there is some leeway in the width of each item unlike when the whole width is made of content and padding.

    Alternatively for good browsers (ie8+) use display:table-cell as mentioned in my last post in this thread.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •