div标签内无序列表的位置问题 [英] Problem with the positining of the unorderd list inside the div tag

问题描述

你好朋友！

我在将ul放置在div标签内时遇到问题.
我参加了一个身分证字号的div.在里面，我有两个div左，右.左div大小为20％，右80％
在左div内，我有一个div LeftBodyTopMenu，在其中，我有一个不规则的列表.我面临的问题是，在运行我的应用程序ul时，它没有位于左边距处，它显示出约15px的间隙.我已将左边距设置为0，但仍然无法正常工作.请帮帮我.

Hello friends!!

i am encountering a problem in positioning my ul inside a div tag.
i have taken a div with id body. inside that i have two div viz left and right. left div size is 20% and rights 80%
inside left div i have a div LeftBodyTopMenu inside which i have a unordred list. the problem that i am facing is that when running my application ul is not at the left margin insted it''s showing a gap of about 15px. i have set left margin to 0 but still it''s not working. please help me out.

<div id="Body" >
    <div id="LeftBody">
    <div class="LeftBodyTopMenu">
    <ul >
    <li style="background-color:#333">Categories</li>
    <li><a href="#">Tables</a></li>
    <li><a href="#">Chairs</a></li>
    <li><a href="#">Dining Tables</a></li>
    <li><a href="#">Beds</a></li>
    <li><a href="#">Lapms</a></li>
    </ul>
    </div>

    </div>
    <div id="RightBody"></div>
    </div>

这是CSS

here is the css

#Body
{
    width:100%;
    margin-left:0px;
    }

#RightBody
{
    width:80%;
     float:right;
    }
#LeftBody
{
 width:20%;
  float:left;
  margin-top:0px;
    }

  .LeftBodyTopMenu
  {
    float:none;
    text-align:left;
    width:100%;
    margin-left:0px;
    margin-top:0px;
    }
 .LeftBodyTopMenu ul
 {
 list-style-type:none;
    text-align:left;
     float:left;
     margin-top:0px;
     width:100%;
     margin-left:0px;
     overflow: hidden;
     text-indent:0px;
    }
 .LeftBodyTopMenu ul li
 {
 text-decoration:none;
 list-style-position:inside;
    display:block;
  margin-left:0px;
  background-image: url(WebsiteImages/topbg.jpg);
  background-repeat:repeat-x;
  text-indent:0px;
   }
 .LeftBodyTopMenu ul li a
 {
 text-decoration:none;
   padding-left:10px;
   font-size:20px;

 }

推荐答案

不，您没有为<li>指定样式；或<ul>; ，而您没有为其指定类.为什么是href="#"?

好，发现一个问题:您需要拥有ul { padding-left: 0; }.你没有它.

OK, a problem found: you need to have ul { padding-left: 0; }. You don''t have it.

您在上一课中删除了边距，然后在最后一课中添加了填充.为什么?删除padding属性是不够的，对于"ul"，您应该明确指定零填充.顺便说一下，从第一个列表元素的嵌入样式中删除几乎黑色"的#333颜色.

You removed margin in the previous class and then added padding in the last one. Why? Removing padding property is not enough, for "ul" you should explicitly specify zero padding. By the way, remove "almost black" color #333 color from embedded style of the first list element.

如何使用肮脏的CSS预期会获得良好的结果?我的建议是:删除所有多余和矛盾的项目，并将其降至最低.如果是您的话，请更改此投票…:-)

How can you expect good results with so dirty CSS? My advice is: remove all redundant and contradictory items, keep it to minimum. And change this vote if it was yours… :-)

这篇关于div标签内无序列表的位置问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！