Enlever white space entre les div
Mithrandir
-
Mithrandir -
Mithrandir -
Bonjour,
J'ai un problème d'un espace entre 2 div qui se suivent verticalement et ma mise en page est au pixel près:
<div>
<img src='images/bandowebcrea.png' alt='bandeau nuages etoiles'/>
</div>
<!-- ici un espace blanc de 4px sous Chrome)-->
<div class='ligne'>
</div>
Pour l'instant j'ai mit cela pour enlever l'écart gênant :
div.ligne{
height:1em;
background-color:#292929;
/* mouais bof */
position:relative;
top:-4px;
}
mais c'est pas un solution qui me ravit et l'écart en pixels peut varier suivant les navigateurs. Mon design n'autorise pas un décalage ne serait ce que 1px.
Une suggestion pour ça?
Merci
J'ai un problème d'un espace entre 2 div qui se suivent verticalement et ma mise en page est au pixel près:
<div>
<img src='images/bandowebcrea.png' alt='bandeau nuages etoiles'/>
</div>
<!-- ici un espace blanc de 4px sous Chrome)-->
<div class='ligne'>
</div>
Pour l'instant j'ai mit cela pour enlever l'écart gênant :
div.ligne{
height:1em;
background-color:#292929;
/* mouais bof */
position:relative;
top:-4px;
}
mais c'est pas un solution qui me ravit et l'écart en pixels peut varier suivant les navigateurs. Mon design n'autorise pas un décalage ne serait ce que 1px.
Une suggestion pour ça?
Merci
A voir également:
- Enlever white space entre les div
- Enlever pub youtube - Accueil - Streaming
- Comment enlever une page sur word - Guide
- Comment enlever les commentaires sur word - Guide
- Enlever mode sécurisé samsung - Guide
- Enlever mot de passe windows 10 - Guide
2 réponses
Bonjour
cela peut venir d'un margin automatique d'image
essaie
img {margin:0;}
cela peu aussi venir de la hauteur de ligne qui varie selon le nav si tu mets du texte dans ligne
donc
.ligne p (ou autre h) {
line-height:1em;
font-size:1em;
}
cela peut venir d'un margin automatique d'image
essaie
img {margin:0;}
cela peu aussi venir de la hauteur de ligne qui varie selon le nav si tu mets du texte dans ligne
donc
.ligne p (ou autre h) {
line-height:1em;
font-size:1em;
}
Merci de votre réponse,
ce n'est pas ça il y a margin et padding 0 dans le css du body
Je vient de trouver un article sur mon problème mais concernant inline-block:
http://www.alsacreations.com/astuce/lire/1432-display-inline-block-espaces-indesirables.html
Du coup j'ai rajouté à l'image display:block; plus d'espace blanc mais plus de text-align:center; ...
Je remets mon code entier, yen a pas long et je sait plus comment centrer sans rajouter d'autres éléments ...
<body>
<div>
<img src='images/bandowebcrea.png' alt='bandeau nuages etoiles' style='' class='imgbando' />
</div>
<div class='ligne'>
et le css:
body{
margin:0;
padding:0;
background-color:#ffffff;
color:#000000;
text-align:center;
font-family:arial;
}
div{
text-align:center;
}
div.ligne{
height:1em;
background-color:#292929;
}
.container{
width:100%;
height:72%;
}
.imgbando{
/*display:block; la ca marche mais plus centré */
}
Si vous avez une réponse ça m'intéresse sinon je vais rajouter des éléments pour centrer l'image.
ce n'est pas ça il y a margin et padding 0 dans le css du body
Je vient de trouver un article sur mon problème mais concernant inline-block:
http://www.alsacreations.com/astuce/lire/1432-display-inline-block-espaces-indesirables.html
Du coup j'ai rajouté à l'image display:block; plus d'espace blanc mais plus de text-align:center; ...
Je remets mon code entier, yen a pas long et je sait plus comment centrer sans rajouter d'autres éléments ...
<body>
<div>
<img src='images/bandowebcrea.png' alt='bandeau nuages etoiles' style='' class='imgbando' />
</div>
<div class='ligne'>
et le css:
body{
margin:0;
padding:0;
background-color:#ffffff;
color:#000000;
text-align:center;
font-family:arial;
}
div{
text-align:center;
}
div.ligne{
height:1em;
background-color:#292929;
}
.container{
width:100%;
height:72%;
}
.imgbando{
/*display:block; la ca marche mais plus centré */
}
Si vous avez une réponse ça m'intéresse sinon je vais rajouter des éléments pour centrer l'image.