Question

我有这样的结构

  <div class='myClass'>
     <ul>
          <li>
               <a href="myfile.html">My link</a>
          </li>
     </ul>
  </div>

我的li有固定的。
但a文字并不总是等于li宽度
因此，可点击区域小于li。我试图通过增加a的宽度来修复它，但它不起作用。
我怎样才能实现它我使用以下css

.tooltipinner ul {
   list-style-type: none;
   margin: 0;
   overflow-y: auto;
   padding: 0;
   width: 305px;
}
.tooltipinner ul li {
    background-color: #BBAEA5;
    background-image: url("../../Images/UIFiles/Menu/SubmenuBg.jpg");
    background-position: left top;
    background-repeat: repeat-x;
    border-top: 1px solid #C1BFBD;
    color: #FFFFFF;
    cursor: pointer;
    float: left;
    font-size: 12px;
    padding-bottom: 4px;
    padding-left: 5px;
    padding-top: 4px;
    width: 199px;
}
.tooltipinner ul li:hover {
    background-color: #BBAEA5;
    background-image: url("../../Images/UIFiles/Menu/SubmenuBgHover.jpg");
    background-position: left bottom;
    background-repeat: repeat-x;
    border-top: 1px solid #C1BFBD;
    cursor: pointer;
    float: left;
    padding-left: 5px;
}
.tooltipinner ul li a {
    color: #000000;
    font-size: 12px;
    font-weight: 400;
    text-decoration: none;
}
.tooltipinner ul li a:link {
    color: #000000;
    min-width: 200px;
    text-decoration: none;
}

我还试图将div放在a内，但block元素不能放在a内。我该如何解决这个问题。

这是一个小提琴 http://jsfiddle.net/qry45/2/
http://jsfiddle.net/qry45/4/

Answer 1

你的CSS中有这样的东西：

.myClass li a {
    width: 100%;
}

如果您使用HTML5文档类型，并且在{{1上设置<a>，则可以将块元素放置在内联元素（<span>，display: block;等）中。元素：

<a>

Answer 2

我不确定，但是如果你将width:inherit;应用于所有内部a，它就会起作用

li {
    width: 400px;
    border: 1px solid red;
}

li a {
    position: relative;
    width: inherit;
    border: 1px solid green;
}

Answer 3

mFragmentManager = getSupportFragmentManager();    
Fragment frag = mFragmentManager.findFragmentById(R.id.fragment_container);
if (frag instanceof LoginFragment) {
   // It's a LoginFragment
} else {
    // It's something else!
}

使用flex-basis显示flex：auto将使用整个li容器，justfy内容将居中文本。这项工作也就是11。

如何增加li里面的锚标签宽度到li宽度

3 个答案: