1486 sujets

Web Mobile et responsive web design

[Résolu] Mes images disparaissent en responsive

Bonjour, j'ai un problème avec mes images lorsque je réduit la taille de la fenêtre. Les images disparaissent dès que le CSS rentre dans la partie responsive (dès que je suis en dessous de 1248 pixels)

Voici mon code



/* Footer */

footer
{
	display: flex;
	justify-content: space-between;
	font-size: 2em;
	margin-top: 15px;
	padding-top: 15px;
	padding-left: 15px;
}


img[title="Becaye"[#black][/#]]
{
	width: 150px;
	height: 150px;
	margin: -10% 10% 0 -50%;
	border-radius: 150px;
}

/* footer - Pour les smartphones et tablettes */

/* smartphones */

@media all and (min-width: 625px) and (max-width: 1248px)
{
	footer
	{
		font-size: 1.1em;
		margin: 3% 0 0 0;
		padding: 4px;
	}
}

/* Tablettes */

@media all and (max-width: 624px)
{
	footer
	{
		font-size: 0.8em;
		margin: 3% 0 0 0;
		padding: 2px;
	}
}


J'espère que vous m'aiderez
Modifié par TheBec (07 Apr 2019 - 20:18)
Hello,

A la lecture du CSS, je ne vois pas vraiment ce qui pourrait causer ton problème. Le mieux serait de pouvoir le reproduire, en postant le code HTML ou un lien vers le site (si possible).
D'accord, merci pour ta réponse. Je sais pas comment envoyer le lien vers le site je vais t'envoyer le HTML


<!DOCTYPE html>
<html lang="fr">
<head>
	<title>Accueil du becsite</title>
	<meta charset="utf-8" />
	<link rel="stylesheet" href="accueil.css" />
	<link rel="shortcut icon" type="image/x-icon" href="../images/logo.png">
	<meta name="viewport" width="device-width" height="device-height" />	<!-- Adapte le viewport à la largeur de la fenêtre -->
</head>
<body>
	<div id="bloc_page">
		<section>
			<article>
				<h1>Quelques articles</h1>		
			</article>

			<aside>
							<!-- Réseaux sociaux -->
				<div id="social">
					<p><a href="https://twitter.com/baldebecaye10"><img src="../images/twitter.png" alt="Twitter" title="Twitter" /></a></p>
					<p><a href="https://www.instagram.com/becaye_officiel/"><img src="../images/instagram.png" alt="Instagram" title="Instagram" /></a><p>
				</div>

			</aside>
		</section>

		<footer>
			<p id="contact">Contactez-moi : <a href="mailto:baldebecaye10@gmail.com" >baldebecaye10@gmail.com</a><br />
			Créateur du site </p>
			<p><img src="../images/bec.jpg" alt="Créateur du site" title="Becaye"></p>
		</footer>
	</div>
</body>
</html>


Voilà ! Les images de aside et du footeur disparaissent (j'ai volontairement réduit le code html pour te faciliter la tâche).
Hello allan ! Le problème est peut-être sur mon ordi je vais le tester ailleurs
En tout cas merci d'avoir confirmé que le problème n'est pas dans le code CSS, je marque résolu.
Modifié par TheBec (09 Apr 2019 - 22:56)
Sujet clos
Aller à