I need to have a bullet list to generate some tabs in a page. This is the page I'm currently working on:
http://citydev.pipehosting.it/francia-en-it/parigi-it/torre-eiffel.html
I need to write "+Info" in one of the tabs - which are all <li>
elements - but it's shown as "Info+" instead... (as seen when visiting the link).
My HTML for the list:
<ul class="tabs">
<li class="current"><strong>Prodotto</strong></li>
<li>Cosa include</li>
<li>In evidenza</li>
<li>Come funziona</li>
<li>Consegna</li>
<li>+Info</li>
<li>Video</li>
</ul>
You may try something like this:
ul li:before {
content: "+";
position: absolute;
left: -5px;
}
ul li {
text-indent: -5px;
}
Check list style types on W3C for more info.
This is because the direction of the text in the tab list is set to right to left
. To fix modify the css to override this declaration to left to right
:
.tabs li {
direction: ltr;
}
or remove direction: rtl;
from where it is set on ul.tabs
.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.