Discussion :

[nicoreims]

Bonjour,

J'ai créé un header avec une grande image de fond (background), qui sera responsive soit par bootstrap soit par un script jquery.

Au dessus de cette image de fond, j'affiche des bulles de texte (4 ou 5) avec simplement un background-color: rgba qui fait une opacité de fond et du texte par dessus.
Les bulles (maxi 250 px de largeur) sont en position relative et sont disséminées de part et d'autre de la grande image de fond.

Tout est bien dans ma résolution, le gros souci est que si je réduis la résolution d'écran, les bulles en position relative, avec par exemple un left à 600 ou 800px sortent complètement du header :-(

Auriez-vous une astuce pour ce genre de situation ?

Merci d'avance à vous
Nicolas

[NoSmoking]

Bonjour,
oublie le positionnement en px, essaie les % ou encore regarde du coté des Media Queries

- Media Queries sur w3.org.
- Media Queries sur developer.mozilla.org.

Rien de moins sûr compte tenu des éléments que tu nous donnes...

[nicoreims]

Bonjour,

Merci pour votre réponse, j'ai trouvé comment faire.
Je cache ou j'affiche les bulles selon la résolution, avec la propriété fournie par bootstart ou par Media Queries.

merci