我的超链接文本在我的link-bullet-list中显得异常

时间:2017-01-15 11:36:22

标签: html css html5 css3 less

如图所示:

当超链接-txt被分成两行时,第2行不会在上面的超链接文本位置下面开始。 它不是从第1行开始的。 第2行如何自动向右缩进?

<CalendarView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/calendarView4"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentStart="true" />

她的Css koden:

<ul class="nav navbar-nav navbar-left collapse navbar-collapse mega" id="navbar-collapse3">
                <li>
                    <div class="mega-menu">
                        <div class="row">
                                <div class="col-sm-3">
                                    <ul>
                                            <li><a href="/netv&#230;rk">This is a very goog</a></li>
                                            <li><a href="/ida-global-business-networks">UPS Global Transtup Transtup</a></li>
                                    </ul>
                                </div>
                        </div>
                    </div>
                </li>
            </ul>

1 个答案:

答案 0 :(得分:0)

你想要这样的东西吗? 我添加了一个新的类框,只是为了你的li元素的大小我也为你的符号设置了ul,所以它看起来像 P.S:您的代码看起来像是在图像中,您的li符号是点●

&#13;
&#13;
nav.navbar .navbar-nav.mega .mega-menu li a {
    color: #d9d9d9;
}

nav.navbar .navbar-nav.mega .mega-menu li a {
    font-size: 16px;
    font-weight: 400;
}

a {
    color: #fd7339;
    text-decoration: none;
    background-color: transparent;
}


nav.navbar .navbar-nav.mega .mega-menu li:before {
    content: "\00BB";
    padding-right: 5px;
}

*, *:hover, *:active {
    outline: 0 none;
}

*:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


nav.navbar .navbar-nav.mega .mega-menu ul {
    list-style: none;
    padding-left: 0;
}
.box{
  width:200px;
  height:50px;
}
ul ul, ol ul, ul ol, ol ol {
    margin-bottom: 0;
}
ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

li {
  padding-left: 1em;
  text-indent: -1em;
}

li:before {
  content: "»";
  margin:auto;
  padding-right: 5px;
  background-color:rgba(0,0,0,0.4);
}

nav.navbar .navbar-nav.mega .mega-menu {
    background-color: #454545;
    width: 1000px;
    min-height: 325px;
    left: -166px;
    z-index: 1;
    position: absolute;
    padding: 20px 50px;
    pointer-events: none;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.2s ease-in-out;
    -moz-transition: opacity 0.2s ease-in-out;
    -o-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
}

nav.navbar .navbar-nav.mega .mega-menu {
    width: 895px;
}



nav.navbar .navbar-nav.mega .mega-menu {
    background-color: #454545;
    width: 1000px;
    min-height: 325px;
    left: -166px;
    z-index: 1;
    position: absolute;
    padding: 20px 50px;
    pointer-events: none;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.2s ease-in-out;
    -moz-transition: opacity 0.2s ease-in-out;
    -o-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
}
&#13;
<ul class="nav navbar-nav navbar-left collapse navbar-collapse mega" id="navbar-collapse3">
                    <div class="mega-menu">
                        <div class="row">
                                <div class="col-sm-3 box">
                                    <ul>
                                            <li><a href="/netv&#230;rk">This is a very goog</a></li>
                                            <li><a href="/ida-global-business-networks">UPS Global Transtup Transtup</a></li>
                                    </ul>
                                </div>
                        </div>
                    </div>
            </ul>
&#13;
&#13;
&#13;