Mise en page casser lors de l'ajout d'un élément

**imothep85** · 24/02/2018, 18h37

dans mon site lorsque j'ajoute une section, çà casse la mise en place du header dans le css.

Voici mon site.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
</head>
<body>
<div class="wrapper"> 
<header>
<nav>
<div class="menu-icon">
<i class=" fa fa-bars fa-2x"></i>
</div>
<div class="logo">
<img src="img/logo2018b.png" id="logo">
</div>
<div class="menu">
<ul>
<li><a href="#01">Accueil</a></li>
<li><a href="#02">Compétences</a></li>
<li><a href="#03">Portfolio</a></li>
<li><a href="#04">Contact</a></li>
</ul>
</div>
</nav>
</header>
<div class="content">
<div id="01"><br><br>
<h3>Accueil</h3>
<p>Lorem ipsum dolor
</p>
 
<div id="04"><br><br>
<div id="info">
<h3>Pour contacter</h3><p>
Par tel: +<br>
Par la route:<br>
<br>
Email: info(@)</p>
 
<p>TVA/BCE:</p>
 
<br>
<div id="social_icons">
        <a href="" target="_blank"><i class="fa fa-facebook-square fa-2x"></i></a>
        <a href="" target="_blank"><i class="fa fa-linkedin-square fa-2x"></i></a>
        <a href="" target="_blank"><i class="fa fa-google-plus-square fa-2x"></i></a>
		<a href="" target="_blank"><i class="fa fa-youtube-square fa-2x"></i></a>
		<a href="" target="_blank"><i class="fa fa-flickr fa-2x"></i></a>
</div>
</div>
</div></div></div>
<div class="content4">
<footer id="footer">
<i class="fa fa-copyright"></i></footer>

des que je veux ajouter une section après mon <div id="01">

ça fout en l'air le design du css:

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
*{
margin:0;
padding:0;
 
}
html, body {
	margin: 0;
	padding:0;
	width: 100%;
 
}
 
body {
	font-family: Roboto;
 
 
}
 
header {
	width: 100%;
	height:100vh;
    background: url("img/page/wallp.jpg") no-repeat;
	background-size: cover;
 
}

le problème est le suivant, le background du header devient plus petit et laisse entrevoir la page blanche.

j''ai besoin d'ajouter cette section au dessus de la 04

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<div id="03"><br><br>
<h3>Portfolio</h3>
<div class="gallery">
<img src="img/portfolio_thumb/1_animation.jpg" alt="animation_thumb" class="div1">
<img src="img/portfolio_thumb/2_application.jpg" alt="application_thumb" class="div2">
<img src="img/portfolio_thumb/3_architecture.jpg" alt="architecture_thumb" class="div3">
<img src="img/portfolio_thumb/4_audiovisuel.jpg" alt="audiovisuel_thumb" class="div4">
<img src="img/portfolio_thumb/5_produit.jpg" alt="produit_thumb" class="div5">
<img src="img/portfolio_thumb/6_web.jpg" alt="web_thumb" class="div6">
</div>

et son css:

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
.gallery {
  width: 90%;
  margin: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  flex-basis: auto;
  align-content: center;
  align-items: center;
 
}

des que je rajoute cette section html ça casse tout, est ce qu'on peut m'aider, j’arrive a la fin de la création de mon site

merci a tous

**psychadelic** · 24/02/2018, 19h17

height:100vh; ?? donc toujours hors page pour le reste... ?

et c'est quoi ton code html et css, faut jouer à les compléter avec le doctype et le rest, fermer les Div, et même pour le css ??
c'est pas cool

**imothep85** · 24/02/2018, 19h41

Je vois pas pourquoi tu t’énerves, je viens ici demander de l'aide c'est le but de ce forum.

La je bloque sur ce problème donc c'est un peu NORMAL de demander de l'aide tu ne crois pas??

Je ne demande pas a ce que l'on me fasse mon site web, je pose la question, qu'est ce qui ne va pas dans mon code qui cause ce problème !!!

merci pour le height:100vh; j'ai remplacé vh par la hauteur de l'image ça marche très bien

**psychadelic** · 24/02/2018, 20h39

Envoyé par imothep85

Je vois pas pourquoi tu t’énerves, je viens ici demander de l'aide c'est le but de ce forum.
La je bloque sur ce problème donc c'est un peu NORMAL de demander de l'aide tu ne crois pas??

Mais c'est tres bien de demander de l'aide, et j'ai d'ailleurs fait l'effort de te répondre.
Poser la question proprement est un minimum, on à pas tous une boule de cristal en état de marche.

Mise en page casser lors de l'ajout d'un élément

Conception Web

Vue hybride

Discussions similaires

Partager

Partager