Background qui s'adapte à la largeur de l'écran

Nestate

11 Feb 2019 à 15:56

bonjour à tous
J'ai un petit soucis au niveau de mon CSS
Je souhaiterai que mon image s'adapte à la largeur de mon écran
Cependant elle n'est pas centré au niveau de la photo qu'il y'a dessus .( Je ne sais pas si c'est trés clair expliqué comme ca )
Avez vous une idée ?

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css">
<title> Web agency </title>
</head>
<div id="bloc_page">

<header>
<div id="Logo">
<img src="images/logo.png" alt=" logo_agence" id="logo" />
</div>

<nav class="menu">
<ul>
<li> <a href="#">Accueil</a> </li>
<li> <a href="#">Services</a> </li>
<li><a href="#"> Portfolio </a></li>
<li><a href="#"> Contact</a> </li>

</ul>
</nav>

<div class="image_presentation">

nav li
{
display:inline;

}

.menu
{
float: right;
}
.image_presentation
{
background: url('images/slider/bg1.jpg') no-repeat;
display: flex;
width:100%;
height:600Px;
}

JENCAL

11 Feb 2019 à 16:13

Salut

Tu parles de ton logo ? Ton site est-il accessible ?

xavierlet

12 Feb 2019 à 10:09

Je n'ai pas vraiment compris ce que tu voulais faire mais:

Si tu veux que ton image que tu mets en background soit centrée, essaye plutôt de la positionner comme ça :


background-image: url('images/slider/bg1.jpg');
background-repeat: no-repeat;
background-size: cover;
background-position: center;

Et si c'est le logo que tu voulais centrer, essaye:


#logo {
  display: flex;
  justify-content: center;
  width: 100%;
}

CSS et mise en forme, CSS3

Background qui s'adapte à la largeur de l'écran