bonjour,
voici mon code html et css
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="partenaires.css">
</head>
<body>
<header>
<table>
<tr>
<td><img class="logo" src="img/6.4Jeunes.png" alt=""></td>
</tr>
</table>
<table>
<tr>
<td><h1 class="titre">PARTENAIRES</h1></td>
</tr>
</table>
<table class="bloc">
<tr>
<td class="rose">JEUNE</td>
<td class="vert">RÉFÉRENT</td>
<td class="bleu">CONSULTANT</td>
<td class="gris">PARTENAIRES</td>
</tr>
</table>
</header>
<!-- Utilisation d'un header pour le titre et le logo -->
<div class="information">
<table>
<tr>
<td>JEUNES6.4 est un dispositif issu de la <underline>charte de l’engagement</underline> pour la</td>
</tr>
</table>
</div>
<div class="info2">
<table>
<tr>
<td>
jeunesse signée en 2013 par des partenaires institutionnels...
</td>
</tr>
</table>
<!--Sépartion en information et info2 pour l'alignement des textes-->
</div>
<div class="info3">
<table>
<tr>
<td>...qui ont décidé de mettre en commun leurs actions pour les jeunes<br>
des Pyrénées-Atlantiques. </td>
</tr>
</table>
</div>
<!--le texte est divisé en tableau pou l'alignement des texte -->
<div class="partenaires">
<img class="RF" src="img/logo république francaise.png" alt="logo républic français">
<img class="RA" src="img/aquitaine.png" alt="region aquitaine">
<img class="PA" src="img/pA.png" alt="pyrénée atlantique">
<img class="AM" src="img/index.png" alt="assurance maladie">
<img class="AJ" src="img/Capture d’écran de 2023-05-26 11-13-34.png" alt="Assises jeunnesse">
<img class="CAF" src="img/Capture d’écran de 2023-05-26 11-20-37.png" alt="CAF">
<img class="MSA" src="img/MSA.png" alt="MSA">
<img class="UNIV" src="img/Capture d’écran de 2023-05-26 11-21-47.png" alt="université de pau">
</div>
<!--Ajouts des images-->
</body>
</html>
img{
width:200px;
object-fit:contain;
}
div{
display: flex;
flex-wrap: wrap;
gap: 110px;
margin: 500px;
position:absolute;
}
.RF{
width:300px;
}
.AJ{
width:280px;
object-fit:contain;
}
.UNIV{
width:255px;
}
.MSA{
width:250px;
}
header{
height: 280px;
width: 2518px;
top:0;
left:0;
background-color:#C6C6C6;
position:absolute;
background: radial-gradient(circle closest-corner at 20% , #c6c6c600, #c6c6c6);
}
/*ajustement de la taille du header*/
.logo{
margin: 10px;
padding-left: 10px;
width:380px;
}
@font-face {
font-family: 'Eurocaps';
src: url(./font2/eurocaps-webfont.woff2) format('woff2'),
url(./font2/eurocaps-webfont.woff) format('woff');
font-weight:normal;
font-style: normal;
}
/*intégrer une police personnaliser avec font-face*/
@font-face {
font-family: 'Albanian';
src: url(./font3/albanian-webfont.woff2) format('woff2'),
url(./font3/albanian-webfont.woff) format('woff');
font-weight: normal;
font-style: normal;
}
.titre{
margin-top: -250px;
padding-left: 1450px;
font-size:180px;
color: rgb(119, 116, 116);
font-family:'Eurocaps';
font-weight: 100;
}
.information{
margin: 380px;
padding-left: 330px;
font-size: 35px;
color:grey ;
font-family:'Albanian';
}
.info2{
margin: 415px;
padding-left: 300px;
font-size: 35px;
color: grey;
font-family:'Albanian';
}
.info3{
margin:1000px;
padding-left:-15px;
font-size: 30px;
color: grey;
font-family:'Albanian';
}
.bloc{
height: 80px;
background-color:#C6C6C6 ;
left: 0;
top: 0;
margin:280px;
position: absolute;
margin-left:730px ;
padding-right:200px;
background: radial-gradient(circle closest-corner at 20% , #c6c6c65d, #c6c6c6);
}
.gris{
cursor: pointer;
padding-left: 25%;
font-size: 35px;
color: grey;
font-family: 'Albanian';
}
.bleu{
cursor: pointer;
padding-left: 18% ;
font-size: 35px;
color: rgb(3, 152, 211);
font-family: 'Albanian';
}
.vert{
cursor: pointer;
padding-left: 12%;
font-size: 35px;
color: rgb(55, 173, 55);
font-family: 'Albanian';
}
.rose{
cursor: pointer;
padding-left: 5%;
font-size: 35px;
color: rgb(241, 9, 117);
font-family: 'Albanian';
}
underline{
color:rgb(22, 22, 151);
}
quand je change la taille du navigateur ça se déforme je vous ai envoyé à quoi ça ressemble.
Pourquoi ça me fais ça ?
Afficher la suite
