Bonjour,
Afin de m'initier à CSS, je veux réaliser un site basique sur ma passion, les feux d'artifice. Le site ne comportera que 4 pages, mais pour l'instant, je me concentre sur celle qui s'appelle "components".

mon site
ma feuille CSS


J'essaye d'appliquer des styles CSS (grande première) sur mes div, et j'ai du mal.
J'ai créé une classe schéma, une classe caption, une classe medias (pour contenir le schema et la caption).

Ce que je veux, c'est avoir "sur la même ligne" mes 2 médias, centrés.

Problème 1 : barre de menu

Je n'ai implémenté pour l'instant que les pages Homepage et Components. Le problème que j'ai, c'est qu'en chargeant la page Components, cela décale toujours ma barre de menu de qq pixels, alors que ça n'a pas lieu avec les autres pages. Test effectué, en éliminant progressivement tout le contenu de la page, ce sont les images et les vidéos qui causent ce décalage.
Pourquoi ? Comment y remédier?

Problème 2 : positionnement des images / vidéos par rapport au texte

En regardant la page Components, je pense que mon pb est évident. Le texte suivant les médias vient se coller à droite, et j'ai beau avoir essayé de mettre mes 2 div medias dans un autre div container, avec les propriétés qui vont bien, j'obtiens toujours le même résultat...
Une idée ?

Bien sûr, étant débutant, je suis ouvert à toute critique, d'autant que je veux que mon site soit validé XHTML, donc si vous repérez des mauvais usages ou si il y a une façon plus propre de faire ce que j'ai fait, merci de me le signaler.

Merci d'avance pour votre aide.