Problème de bordures incomplètes (CSS)

Résolu/Fermé
rick7 Messages postés 248 Date d'inscription mercredi 25 juillet 2007 Statut Membre Dernière intervention 12 avril 2024 - Modifié le 12 mai 2018 à 18:00
rick7 Messages postés 248 Date d'inscription mercredi 25 juillet 2007 Statut Membre Dernière intervention 12 avril 2024 - 13 mai 2018 à 15:38
Bonjour,

J’ai cherché sur le net et fais de multiples tests, mais je n’arrive pas à prolonger certaines bordures.

Comme sur la capture écran (ci-dessous), si j’ai un logo/image la bordure à droite est bien complète, mais à partir du moment où j’ai du texte la bordure est incomplète.


Dans l’exemple, on voit "test" qui tient sur une ligne, dans ce cas la bordure s’arrête sur la première ligne, si il y a deux lignes la bordure s’arrêtera sur la deuxième ligne et ainsi de suite.

Si quelqu’un à une idée merci.


2 réponses

1Seb Messages postés 166 Date d'inscription dimanche 27 mars 2016 Statut Membre Dernière intervention 30 octobre 2021 37
12 mai 2018 à 18:57
Bonjour,

Si tu as une url ou un bout de code pour jeter un coup d'oeil
0
rick7 Messages postés 248 Date d'inscription mercredi 25 juillet 2007 Statut Membre Dernière intervention 12 avril 2024 4
Modifié le 12 mai 2018 à 19:45
Bonjour,

Merci pour ton aide 1Seb, je suis encore sur le code pour essayer de comprendre d'où vient le problème. J'ai préféré remettre le code tel qu'il était au départ (avec le problème de bordure à droite également à côté du logo/image).


Le code CSS :

.chart1 {
 WIDTH: 900px; FLOAT: left
}
.chart_1_row_1 {
 TEXT-ALIGN: center;
 WIDTH: 900px;
 FONT: bold 11px/24px Verdana, Arial, Helvetica, sans-serif;
 BACKGROUND: #a23040;
 FLOAT: left;
 COLOR: #ffffff;
}
.chart_1_row_1 .col11 {
 WIDTH: 34px;
 FLOAT: left;
 BORDER-RIGHT: #ffffff 1px solid;
}
.chart_1_row_1 .col12 {
 WIDTH: 140px;
 FLOAT: left;
 BORDER-RIGHT: #ffffff 1px solid;
}
.chart_1_row_1 .col13 {
 WIDTH: 60px; FLOAT: left; BORDER-RIGHT: #ffffff 1px solid
}
.chart_1_row_1 .col14 {
 WIDTH: 365px; FLOAT: left; BORDER-RIGHT: #ffffff 1px solid
}
.chart_1_row_1 .col15 {
 WIDTH: 280px; FLOAT: left; BORDER-RIGHT: #ffffff 1px solid
}
.chart_1_row_1 .col16 {
 WIDTH: 50px; FLOAT: left; BORDER-RIGHT: #ffffff 1px solid
}
.chart_1_row_1 .col17 {
 WIDTH: 128px; FLOAT: left; BORDER-RIGHT: #ffffff 1px solid
}
.chart_1_row_1 .col18 {
 WIDTH: 177px; FLOAT: left
}
.chart_1_row_2 {
 TEXT-ALIGN: center; PADDING-BOTTOM: 4px; PADDING-LEFT: 0px; WIDTH: 900px; PADDING-RIGHT: 0px; FONT: bold 11px/38px Verdana, Arial, Helvetica, sans-serif; BACKGROUND: #eee; FLOAT: left; COLOR: #000; PADDING-TOP: 4px;  BORDER-RIGHT: #ffffff 1px solid
}
.chart_1_row_2 .col11 {
 WIDTH: 35px; FLOAT: left
}
.chart_1_row_2 .col12 {
 PADDING-BOTTOM: 2px; PADDING-LEFT: 0px; WIDTH: 140px; PADDING-RIGHT: 0px; FLOAT: left; PADDING-TOP: 2px;
}
.chart_1_row_2 .col13 {
 WIDTH: 60px; FLOAT: left; PADDING-TOP: 4px; font-weight: normal; line-height: normal; font-size: 1.1em;
}
.chart_1_row_2 .col14 {
 WIDTH: 365px; FLOAT: left; PADDING-TOP: 4px; font-weight: normal; line-height: normal; font-size: 1.1em;  PADDING-RIGHT: 0px;
}
.chart_1_row_2 .col15 {
 WIDTH: 280px; FLOAT: left; PADDING-TOP: 4px; font-weight: normal; line-height: normal; font-size: 1.1em;
}
.chart_1_row_2 .co1l6 {
 WIDTH: 50px; FLOAT: left; PADDING-TOP: 4px; font-weight: normal; line-height: normal; font-size: 1.1em;
}
.chart_1_row_2 .col17 {
 WIDTH: 128px; FLOAT: left; PADDING-TOP: 9px
}
.chart_1_row_2 .col18 {
 WIDTH: 177px; FLOAT: left
0
1Seb Messages postés 166 Date d'inscription dimanche 27 mars 2016 Statut Membre Dernière intervention 30 octobre 2021 37
12 mai 2018 à 20:25
As-tu le bout de code html aussi ?
0
rick7 Messages postés 248 Date d'inscription mercredi 25 juillet 2007 Statut Membre Dernière intervention 12 avril 2024 4
Modifié le 12 mai 2018 à 21:22
oui. Merci pour ton aide, voilà le code HTML :

<DIV class=main_contaime>
 <DIV class=clear>  </DIV>
<DIV class=chart1>
<DIV class=chart_1_row_1>
<DIV class=col12>a</DIV>
<DIV class=col13>b</DIV>
<DIV class=col14>c</DIV>
<DIV class=col15>d</DIV>
<DIV class=col16>e</DIV>

<DIV class=chart_1_row_2>
<DIV style="VERTICAL-ALIGN: top" class=col12>
<A href="" rel="nofollow" target="_blank">
<IMG border=0 align=center src="images/screen1.gif" width=100 height=35></A></DIV>
<DIV class=col13>TEST1</DIV>
<DIV class=col14>A</DIV>
<DIV class=col15>B</DIV>
<DIV class=col16>C</DIV>
</DIV>

<DIV class=chart_1_row_3>
<DIV style="VERTICAL-ALIGN: top" class=col12>
<A href="" rel="nofollow" target="_blank">
<IMG border=0 align=center src="images/screen2.gif" width=100 height=35></A></DIV>
<DIV class=col13>TEST2</DIV>
<DIV class=col14>A</DIV>
<DIV class=col15>B</DIV>
<DIV class=col16>C</DIV>
</DIV>
0
1Seb Messages postés 166 Date d'inscription dimanche 27 mars 2016 Statut Membre Dernière intervention 30 octobre 2021 37
12 mai 2018 à 21:45
Si tu as le code html et css complet ou une url ça m'arrangerais, car avec ce bout de code je n'arrive pas à reproduire l'exemple.
En MP ça t'embête de l'afficher.
0
rick7 Messages postés 248 Date d'inscription mercredi 25 juillet 2007 Statut Membre Dernière intervention 12 avril 2024 4
13 mai 2018 à 15:38
(Vu en MP) merci pour ton aide 1Seb ; sujet clos.
0