Images liens collées verticalement...

Marsh Posté le 27-03-2015 à 19:20:33

Bonjour ! :bounce:
Je cherche depuis quelques temps à créer mon site web. J'ai créé un menu composé d'images - liens.
Or je n'arrive pas à coller verticalement deux images, il y a toujours un espace entre les deux :

Je ne sais pas si ça vient des images ou bien des liens.
Dans mon fichier CSS, du côté des images et des liens j'ai tout essayé : margin: 0, padding: 0, border: 0 ...

Pouvez-vous m'aider SVP ?
Merci d'avance ! :hello:

Reply

Marsh Posté le 27-03-2015 à 19:20:33

Reply

Marsh Posté le 28-03-2015 à 19:43:18

As-tu tenté collapse ? Je ne vois que ça...

---------------
Réveillez-vous, ça fait 2 boeing par jour :fou:

Reply

Marsh Posté le 28-03-2015 à 20:40:09

Je viens d'essayer border-collapse: collapse; mais rien du tout :pfff: un vrai mystère, j'ai dû oublier un truc dans mon code :sweat: merci quand même chipeauteur
Du coup je vous mets tout :
L'apparence de mon site avec l'espace entre les images :

...
Mon code HTML complet :
-----------------------------------------------------------------------------------------------------------------------------------
<!DOCTYPE HTML>
<html>
<head>
<meta charset = "utf-8" />
<link rel = "stylesheet" href = "../styles/style.css" />
<title>ACTUALITES</title>
</head>
<body>
<header>
<h1>ACTUALITES</h1>
<h2>Bienvenue sur mon site !</h2>
</header>
<?php
$jour = date("d" );
$mois = date("m" );
$annee = date("Y" );
$heure = date("H" ) + 1;
$minute = date("i" );
?>
<nav><a href="#"><img src = "../images/forum.jpg" /></a><a href = "#"><img src = "../images/urnepol.jpg" /></a> </nav>
<div id = "ladate"><?php echo "Nous sommes le $jour/$mois/$annee et il est $heure h $minute.";?></div>

<div id = "infomaintenance">Information</div><br /><br />
<p class = "infomaintenancep">Le site est en cours de construction. Il sera en ligne cet été.<br /></p>

=== ZONE DE TEST === <br />
<?php echo "LE PHP EST <strong>OPERATIONNEL</strong>!<br />";

?>

<?php include ("footer.php" ); ?> 
</body>

</html>
--------------------------------------------------------------------------------------------------------------------
Ainsi que mon code CSS complet :
________________________________________________________________________________________________

header
{
background-color: rgb(112,146,190);
}

h1
{
color: #ececec;
text-shadow:1px 1px #000;
font-size: 4em;
margin: 0;
text-align: center;

}

h2
{
color: yellow;
text-align: center;
}

body
{
background-image: url(../images/superfond.png);
margin: 0;
}

#infomaintenance
{
font-size: 1.3em;
text-decoration: underline;
color: navy;
text-align: center;
}

.infomaintenancep
{
text-align: center;
}
#ladate
{
position: absolute;
top: 97px;
left: 10px;
color: white;
border: 1px solid white;

}

p
{
margin-left: 30px;
}

footer
{
background-color: rgb(3,125,186);
color: white;
margin: 0;
border-top: 5px solid rgb(0,45,145);
width: 100%;
position: fixed;
bottom: 0px;

}

img
{
margin: 0px;
border: none;
padding: 0px;
}

a
{
margin: 0px;
padding: 0px;
border: none;
}

br
{
margin: 0px;
padding: 0px;
border: none;
}

nav
{
margin: 0px;
padding: 0px;
border: none;
width: 20%;
}

______________________________________________________________________________________________________

Merci d'avance, si jamais vous trouvez quelque chose qui cloche !

Message édité par bachibouzooo le 28-03-2015 à 20:41:35

Reply

Marsh Posté le 06-04-2015 à 01:18:20

Tu utilises la balise nav c'est pour cela que tu as des espaces et tu ne peux pas régler ça en modifiant les photos vu que le problème est déjà hérité.

Remplace le contenu de ta balise nav par ce qui suit :

Code :

<nav>
<ul>
<li><a href="#">
<img src="../images/forum.jpg" />
</a></li>
<li><a href="#">
<img src="../images/urnepol.jpg" />
</a></li>
</ul>
</nav>

Ensuite dans ton CSS tu effaces tout ce que tu as mis sur : img, br, nav, a
puis tu rajoutes ça :

Code :

ul {
list-style: none;
}
li {
font-size : 0px;
}

Message édité par caps lock le 06-04-2015 à 01:18:47

Reply

Images liens collées verticalement...

Sujets relatifs:

Leave a Replay