Se connecter

Informatique

Programmation

Sujet : [HTML] Problème avec mon footer en bas de page
1
Patamaudelay
Niveau 10
20 octobre 2017 à 18:59:07

Salut [[sticker:p/1kkr]]
J'ai un TP a rendre pour mardi ( je suis en 1ère année de DUT info ) dans le quel je doit faire un site assez complet en utilisant les propriété flex. Pas de soucis , j'ai bien maîtrisé le truc en tout cas je pense, mais le problème est que je n'arrive pas à placer mon footer en bas de page correctement. En cherchant des tuto sur le net j'ai trouvé qu'en plaçant un min-height: 100vh; sur mon body ça marchait. Mais maintenant le problème est que j'ai une vidéo d'incrusté sur mon site, et maintenant je ne sais pas pourquoi elle prend tout la largeur de la page : https://gyazo.com/a06d6223c42bbeea9eb1f9d8a2dc7f62
Je vous passe mon code :

#video{
display: flex;
flex-direction: row;
flex: 4;
justify-content: space-around;
}

body {
display : flex;
flex-direction: column;
justify-content: center;
width: 50%;
margin: auto;
margin-bottom: 0;
min-height: 100vh;
}

.main ( la partie avec tout le contenu du site a part la navbar ) {
display: flex;
flex: 1;
flex-direction: row-reverse;
margin-top: 35px;
}

Le code de la page vidéo : ( seulement la partie main )

<div class="main">
<div id="aside">
<aside id="saison">
<ul id="listeSaison">
<li>
<a href="saison1"> Saison 1 </a>
</li>
<br/>
<li>
<a href="saison2"> Saison 2 </a>
</li>
<br/>
<li> <a href="saison3"> Saison 3 </a>
</li>
<br/>
<li> <a href="saison4"> Saison 4 </a>
</li>
<br/>
<li>
<a href="saison5"> Saison 5 </a>
</li>
<br/>
</ul>
</aside>
</div>
<section id="video">
<article id="description">
<h3> titre de la vidéo </h3>
<p>ceci est la vidéo, elle est géniale</p>
</article>

<video controls="controls" width="600">
<source src="video.mp4" type="video/mp4">
<source src="video.wbm" type="video/webm">
<source src="video.ogv" type="video/ogv">
Your browser does not support the video
</video>

</section>
</div>

Voila, je suis un newbie en dev web donc si vous avez besoin d'autre partie de mon code dites le moi.
Merci [[sticker:p/1kkl]]

20_cent_2017
Niveau 10
21 octobre 2017 à 12:15:44

codepen stp et n'uitlise pas vh...

% > em > px ! [[sticker:p/1lm9]]

pense à setter ton html et ton body à 100%

1
Sujet : [HTML] Problème avec mon footer en bas de page
   Retour haut de page
Consulter la version web de cette page