28172 sujets

CSS et mise en forme, CSS3

Décaler un border bottom vers la droite

Bonjour,

J'ai mis un border bottom à mes li et mes li ont un padding left, mais la bordure n'en tient pas compte, j'ai donc triché en mettant un border left de la couleur de mon fond, mais ça décale plus mon texte que ma bordure bottom.

Y aurait il un moyen de décaler vers la droite ma bordure ?

<dl id="document-toc" class="portlet toc" style="">
<dt class="portletHeader">Sommaire</dt>
<dd class="portletItem">
<ol class="TOC1Digit">
<li>
<a href="http://dev_yoan.afdas.pilotsystems.net/employeur/former/dif/spectacle#section-25">En cas de licenciement (sauf faute lourde ou licenciement économique avec acceptation du contrat de sécurisation professionnelle - CSP), et si la demande est formulée pendant le préavis.</a>
<ol>
<li>
<a href="http://dev_yoan.afdas.pilotsystems.net/employeur/former/dif/spectacle#section-26">Si l’action débute pendant le préavis</a>
</li>
<li>
<a href="http://dev_yoan.afdas.pilotsystems.net/employeur/former/dif/spectacle#section-27"> Si l’action débute après le préavis</a>
</li>
</ol>
</li>


#document-toc dd.portletItem ol.TOC1Digit li{
	list-style-image: url('picto_dossier.png');
	padding: 5px 0;
	border-bottom: solid 1px #EF6227;
	border-left: solid 12px #FAF6EB;
}
	
#document-toc dd.portletItem ol.TOC1Digit li a{
	text-transform: uppercase;
	font-weight: bold;
	font-size: 14px;
	color: #6C5649;
	}


Merci par avance ! Smiley rolleyes
Modérateur
Bonjour,

Tu veux décaler ton texte "Si l'action débute après le préavis" du numéro ou le numéro avec ?


EDIT : mea culpa j'avais mal lu, en fait tu veux augmenter l'espace entre la puce et le texte sans que le border ne suive pas
Modifié par _laurent (02 Oct 2012 - 14:52)
Modérateur
Ha mais tu n'as pas de puce au final ?

Du coup un margin-left sur les li ne suffit pas ?



EDIT : ooops désolé
Modifié par _laurent (02 Oct 2012 - 15:10)
Non le padding décale le texte mais pas la boite (j'ai essayé aussi de mettre un display-block: inline) mais ça casse tout Smiley decu
Ah et le margin du coup décale aussi mes puces "dossier"...
Modifié par magali_infographiste (02 Oct 2012 - 15:13)
Modérateur
Pfiou je suis fatigué j'avais pas vu pour les puces. Mais du coup ce sont des puces persos, tu devrais pouvoir faire une image avec du "vide" a droite pour l'écarter du texte...
Sujet clos
Aller à