Sto cercando di ottenere che tutto il testo in questo elenco sia allineato al punto. Tuttavia, il testo si sta avvolgendo sotto l'immagine del proiettile. Ho provato a cambiare il padding/margin su ae li e anche nowrap, ma questo lo fa semplicemente sporgere oltre il bordo destro. I proiettili sono i loghi WBI sotto Notizie: http://circore.com/womensbasketball/ Qualche idea? Grazie!il testo si sta spostando sotto il punto elenco nella lista css
Ho fatto questo sul tuo sito con Firefox e funziona
#menu-news li:first-of-type {
border-top: medium none;
height: 55px;
list-style-position: inside;
margin-left: 8px;
margin-right: 15px;
padding: 10px 10px 10px 66px;
vertical-align: top;
}
#menu-news li {
background: url("images/wbismall.png") no-repeat scroll 0 0 transparent;
border-top: 1px solid #666666;
height: 55px;
list-style-position: inside;
margin-left: 10px;
margin-right: 15px;
padding: 10px 10px 10px 66px;
}
Si potrebbe provare
ul {
list-style-position: outside;
}
ma vorrei usare personalmente un'immagine di sfondo e un po 'imbottitura, qualcosa di simile a:
li {
list-style: none;
background: transparent url(your/icon.png) no-repeat left center;
padding-left: 20px; /* or whatever the width of your image is, plus a gap */
}
Vai a questa pagina per maggiori dettagli: http://www.tm4y.co.za/general-tips/css-bulleted-lists-styling.html
rendendo lo sfondo l'immagine del proiettile e togliendo il tipo di proiettile funziona. tuttavia, la seconda riga di testo nel collegamento si sovrappone all'immagine. questi sono tutti i titoli dei post di wordpress, quindi non posso aggiungere un semplice
lì. –
Elaine
Hai aggiunto padding all'elemento per spostare il testo oltre l'immagine? –
l'immagine è un'immagine di sfondo dietro l'elenco, quindi non posso aggiungere padding ad esso. – Elaine
È è necessario aggiungere display: inline-block; al collegamento all'interno dell'elemento td.
La classe si presentava così:
#menu-news li a {
color: #000000;
font-family: Arial,Helvetica,sans serif;
font-size: 13px;
margin-top: 10px;´
}
ma hanno bisogno di simile a questa:
#menu-news li a {
display: inline-block;
color: #000000;
font-family: Arial,Helvetica,sans serif;
font-size: 13px;
margin-top: 10px;
width: 200px;
}
si! tutto si sta comportando ora. Grazie a tutti voi! – Elaine
Questo funziona per liste non ordinate:
#menu-news ul {
list-style:outside circle;
margin-left:60px;
}
#menu-news ul li {
padding-left:20px;
}
margin-left sposta l'intera lista di 60 px.
Il numero padding-left è necessario solo se si desidera spazio aggiuntivo tra il punto elenco e il testo dell'elemento di elenco. Il testo dell'elemento di elenco viene disposto sotto se stesso e non sotto il punto elenco.
Potete per favore aggiungere il codice pertinente originale a questa domanda in modo che possa essere utile a persone che in futuro potrebbero avere lo stesso problema? – KatieK
Il codice è lo stesso nella mia risposta ad eccezione delle specifiche del lato sinistro del padding. – PAULDAWG