Have menu buttons centered css dropdown menu

I am using this css for styling my menu. The menu `li`'s are currently set to `float: left` which obviously positions them to the left, however I would really like them centred in the middle. **Could anyone help me with modifying this please?** .menu{ border:none; border:0px; margin:0px; padding:0px; font: 67.5% "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif; font-size:14px; font-weight:bold; } .menu ul{ background:#6991B7; height:35px; list-style:none; margin:0; padding:0; } .menu li{ float:left; padding:0px; } .menu li a{ background:#6991B7 url("images/seperator.gif") bottom right no-repeat; color:#FFF; display:block; font-weight:normal; line-height:35px; margin:0px; padding:0px 25px; text-align:center; text-decoration:none; } .menu li a:hover, .menu ul li:hover a{ background: #2580a2 url("images/hover.gif") bottom center no-repeat; color:#FFFFFF; text-decoration:none; } .menu li ul{ background:#333333; display:none; height:auto; padding:0px; margin:0px; border:0px; position:absolute; width:225px; z-index:200; /*top:1em; /*left:0;*/ } .menu li:hover ul{ display:block; } .menu li li { background:url('images/sub_sep.gif') bottom left no-repeat; display:block; float:none; margin:0px; padding:0px; width:225px; } .menu li:hover li a{ background:none; } .menu li ul a{ display:block; height:35px; font-size:12px; font-style:normal; margin:0px; padding:0px 10px 0px 15px; text-align:left; } .menu li ul a:hover, .menu li ul li:hover a{ background:#2580a2 url('images/hover_sub.gif') center left no-repeat; border:0px; color:#ffffff; text-decoration:none; } .menu p{ clear:left; }
What does the HTML look like for your navigation?

以上就是Have menu buttons centered css dropdown menu的详细内容,更多请关注web前端其它相关文章!

赞(0) 打赏
未经允许不得转载:web前端首页 » CSS3 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准