13 {{ upvoteCount | shortNum }}
13 {{ upvoteCount | shortNum }}

How do I center this menu?

by ThomasTe
11 replies
Hi,

I've found this menu, and would like to center it:
CSSnewbie Example: CSS-Only Dropdown Menu

How do I do that?

Thanks.

Best regards,
Thomas
#center #menu
  • Profile picture of the author webpro4hire
    modify the #navbar selector style:

    Code:
    #navbar {
   margin: 0;
   padding: 0;
   height: 1em; }

should be : 

#navbar {
   width: 335px;
   overflow: auto;
   margin: 0 auto;
   padding: 0; }
    That should do the trick
    {{ DiscussionBoard.errors[3197496].message }}
  • Profile picture of the author ThomasTe
    Thanks, webpro4hire.

    I have another issue with the menu. I've sent you an email.

    Thanks.

    Best regards,
    Thomas
    {{ DiscussionBoard.errors[3202905].message }}
  • Profile picture of the author indianbill007
    Hi,
    Expert here. Hit me for more details
    {{ DiscussionBoard.errors[3203716].message }}
  • Profile picture of the author webpro4hire
    Thomas,

    I did not receive your email ... did you send to webpro4hire@gmail.com ?

    ttyl,
    WP4H
    {{ DiscussionBoard.errors[3204041].message }}
    • Profile picture of the author ThomasTe
      Hi wp4h,

      Yes, I sent it to the email address in your sig earlier today (European time).

      I followed your advice and the menu is centered now.
      However, it creates kind of a spacing below the menu. Can I remove this?
      I've tried to just drag it up in MS Expression for Web, but then the sub-items in the menu do not always show correctly.

      I would like the menu to kind of continue to the sides, so it creates a bar that is 100% of the width, but still with a 1024px menu in the center, like the menu at www.timesheetreporter.com. I thought that the easiest way to do this was simply to put the menu in a table, but as said it creates some spacing below itself.

      Thanks.

      Best regards,
      Thomas
      {{ DiscussionBoard.errors[3204313].message }}
  • Profile picture of the author webpro4hire
    Thomas,

    very strange, I have not received anything yet via email.

    as for the spacing issue. Have you added attributes cellpsacing=0 cellpadding=0 to the <table> tag?

    WP4H
    {{ DiscussionBoard.errors[3204591].message }}
  • Profile picture of the author ThomasTe
    Thanks, Vickey. However, I have made it centered, now I have some issues with it's height.

    @wp4h: The spacing of the table should be fine. But it seems that the menu creates some spacing below itself. Do you perhaps have another email address I can try?

    Is there another way to make the menu 100% of the width of the page (while still keeping the menu items at the center)?

    Thanks alot.

    Best regards,
    Thomas
    {{ DiscussionBoard.errors[3209314].message }}
  • Profile picture of the author ThomasTe
    Yes, yes, yes! Finally. When I used to code many years ago, it was always a missing ; that was the case.
    This time it was simply a &nbsp; that for some reason had sneaked its way in there, and created the extra spacing.

    It works now.

    Thanks alot guys.

    Best regards,
    Thomas
    {{ DiscussionBoard.errors[3210822].message }}
  • Profile picture of the author fokerss
    just make aglin= center?
    {{ DiscussionBoard.errors[3211520].message }}
  • Profile picture of the author ThomasTe
    Hi,

    I still have some issues here. When I add the code to my webpage, instead of showing the submenus, it keeps them in the same table, and makes that table scrollable.
    Any advice?
    I got it to work, but then it showed the sub menus behind the pictures that were below it, instead of on top. Can I change that?

    Thanks, guys.

    Best regards,
    Thomas
    {{ DiscussionBoard.errors[3217792].message }}
  • Profile picture of the author ThomasTe
    I think it works now, thanks.

    Best regards,
    Thomas
    {{ DiscussionBoard.errors[3222988].message }}

Trending Topics