Ik wil alle inspringingen uit ulverwijderen. Ik heb geprobeerd margin, padding, text-indentin te stellen op 0, maar het mocht niet baten. Het lijkt erop dat het instellen van text-indentop een negatief getal werkt – maar is dat echt de enige manier om de inspringing te verwijderen?
Antwoord 1, autoriteit 100%
Stel de lijststijl en linkerpadding in op niets.
ul {
list-style: none;
padding-left: 0;
}
Antwoord 2, autoriteit 21%
Mijn voorkeursoplossing om <ul> inspringen is een eenvoudige CSS one-liner:
ul { padding-left: 1.2em; }<p>A leading line of paragraph text</p>
<ul>
<li>Bullet points align with paragraph text above.</li>
<li>Long list items wrap around correctly. Long list items wrap around correctly. Long list items wrap around correctly. Long list items wrap around correctly. Long list items wrap around correctly. </li>
<li>List item 3</li>
</ul>
<p>A trailing line of paragraph text</p>Antwoord 3, autoriteit 2%
display:table-row;verwijdert ook de inspringing, maar verwijdert de opsommingstekens.
Antwoord 4, autoriteit 2%
Voeg dit toe aan uw CSS:
ul { list-style-position: inside; }
Hierdoor worden de li-elementen in dezelfde inspringing geplaatst als andere alinea’s en tekst.
Ref: http://www.w3schools.com/cssref/pr_list- style-position.asp
Antwoord 5
Verwijder de opvulling:
padding-left: 0;
Antwoord 6
Kun je een link geven?
Met dank
ik kan even kijken
Waarschijnlijk is je css-selector niet sterk genoeg of kun je het proberen
padding:0!important;
Antwoord 7
Live demo: https://jsfiddle.net/h8uxmoj4/
ol, ul {
padding-left: 0;
}
li {
list-style: none;
padding-left: 1.25rem;
position: relative;
}
li::before {
left: 0;
position: absolute;
}
ol {
counter-reset: counter;
}
ol li::before {
content: counter(counter) ".";
counter-increment: counter;
}
ul li::before {
content: "●";
}
Omdat de oorspronkelijke vraag onduidelijk is over de vereisten, heb ik geprobeerd dit probleem op te lossen binnen de richtlijnen van andere antwoorden. In het bijzonder:
- Lijst opsommingstekens uit met tekst buiten alinea’s
- Meerdere regels binnen hetzelfde lijstitem uitlijnen
Ik wilde ook een oplossing die niet afhankelijk was van browsers die het eens waren over hoeveel opvulling ze moesten gebruiken. Ik heb voor de volledigheid een geordende lijst toegevoegd.
Antwoord 8
Ik heb hetzelfde probleem met een voettekst die ik probeer te verdelen. Ik ontdekte dat dit voor mij werkte door een paar van de bovenstaande suggesties te combineren:
footer div ul {
list-style-position: inside;
padding-left: 0;
}
Dit lijkt het links onder mijn h1 te houden en de opsommingstekens binnen de div in plaats van buiten links.
Antwoord 9
Als ik dit inline doe, stel ik de marge in op 0 (ul style=”margin:0px”). De opsommingstekens worden uitgelijnd met de alinea zonder overhang.