Un petit trait qui apparaît entre mes boutons (menu)

Résolu/Fermé
Eritou
Messages postés
82
Date d'inscription
samedi 20 décembre 2014
Statut
Membre
Dernière intervention
2 juin 2022
- 16 juil. 2016 à 15:40
Eritou
Messages postés
82
Date d'inscription
samedi 20 décembre 2014
Statut
Membre
Dernière intervention
2 juin 2022
- 18 juil. 2016 à 19:52
Bonjour,
J'ai entre mes boutons un petit trait (voir photo) dont il m'est impossible de trouver la cause.
Je vous joint les CSS :
body{
width: 100%;
height: 100%;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px;
text-align: center;
}
.container {
padding: 0;
position: relative;
text-align: center;
width: 100%;
background-color: #272727;
}


/* Button */
#menu{
width: 100%;
height: 35px;
background-color: #272727;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
}

.button {
color: #dc4d4d;
cursor: pointer;
display: inline-block;
height: 35px;
letter-spacing: 2px;
line-height: 35px;
/* [disabled]float: left; */
min-width: 220px;
overflow: hidden;
position: relative;
text-align: center;
-webkit-transition: background-color 0.35s;
-moz-transition: background-color 0.35s;
transition: background-color 0.35s;
padding-left: 0px;
padding-right: 0px;
margin-left: 0px;
margin-right: 0px;
width: auto;
}

.label {
display: block;
height: 100%;
padding-top: 0;
padding-right: 10px;
/* [disabled]padding-left: 10px; */
padding-bottom: 0;
position: relative;
top: 0%;
-webkit-transition: top 0.35s;
-moz-transition: top 0.35s;
transition: top 0.35s;
width: 100%;
}


.button:hover {
background-color: #23b2b2;
color: #fff;
}

.button:hover .label {
top: -100%;
}

/*Main Page Styles*/

.middleMan{
margin: 0 auto;
width: 100%;
text-align: center;
}


Quelqu'un saurait-il la cause de ce soucis ?
Merci et bon week-end,
E.



2 réponses

telliak
Messages postés
3635
Date d'inscription
mercredi 20 septembre 2006
Statut
Membre
Dernière intervention
27 juin 2022
872
17 juil. 2016 à 15:48
Salut,
Sauf à être devin, avec tout ce que tu donnes il me semble bien peu probable que ton problème puisse être identifié, notamment sans le code HTML. Ta page n'est pas accessible ?
0
Eritou
Messages postés
82
Date d'inscription
samedi 20 décembre 2014
Statut
Membre
Dernière intervention
2 juin 2022
1
17 juil. 2016 à 16:30
Slt telliak,
Voici le html complet de la barre des menus :
<div id="menu">
<div class="middleMan">

<a href="menu_archive.html" rel="nofollow" target="_blank">
<div class="button">
<span class="label">Portfolio</span>
<span class="label">What I've Done</span>
</div>
</a>
<a href="menu_archive.html" rel="nofollow" target="_blank">
<div class="button">
<span class="label">Services</span>
<span class="label">What I Do</span>
</div>
</a>
<a href="#contact" rel="nofollow" target="_blank">
<div class="button">
<span class="label">CONTACT</span>
<span class="label">Say hello, or ask a question</span>
</div>
</a>
</div>
</div>

J'étais persuadé que le problème venait des CSS, d'où le HTML non inclus dans la question. As-tu une idée du soucis ?
Merci,
E.
0
telliak
Messages postés
3635
Date d'inscription
mercredi 20 septembre 2006
Statut
Membre
Dernière intervention
27 juin 2022
872
17 juil. 2016 à 23:55
Re,
Cela vient d'une espace qui est pris comme étant un lien, ajoute
.middleMan a {
    text-decoration: none;
}    
dans ton CSS et ce sera corrigé.
0
Eritou
Messages postés
82
Date d'inscription
samedi 20 décembre 2014
Statut
Membre
Dernière intervention
2 juin 2022
1 > telliak
Messages postés
3635
Date d'inscription
mercredi 20 septembre 2006
Statut
Membre
Dernière intervention
27 juin 2022

18 juil. 2016 à 19:52
Merci beaucoup telliak ! Bien joué ;)
Bonne soirée,
E.
0