Observing the image:
https://i.sstatic.net/uSezX.png
In the scenario where the hyperlink text is split into two lines, the second line does not align with the starting position of the first line. How can we automatically indent the second line to the right?
<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ærk">This is a very good example</a></li>
<li><a href="/ida-global-business-networks">UPS Global Transtup Transtup</a></li>
</ul>
</div>
</div>
</div>
</li>
</ul>
This is the CSS code:
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;
}
ul ul, ol ul, ul ol, ol ol {
margin-bottom: 0;
}
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;
}