Créer une barre de recherche HTML de la longueur de la page ?

Html

DrFreeze Messages postés 150 Date d'inscription Statut Membre Dernière intervention -
Hestia44 Messages postés 140 Date d'inscription Statut Membre Dernière intervention - 15 janv. 2013 à 18:57

Bonjour,

D'abord je me présente: J'ai 15 ans et j'aime créer des sites webs.... Je suis autodidacte, j'apprend en regardant des modèles déjà fait, et la il y a quelque chose que je ne trouve pas ...

Alors , je vous dit mon probleme : quand je vais sur FaceBook, je constate que la page est centrée (jusque là, pas de problème) mais ce que j'aimerai pouvoir faire, c'est une barre de recherche similaire à ce réseau social, c'est-à-dire qui s'étend sur toute la longueur de la page, quelque soit l'écran.

Je vous explique plus clairement : sur ce site, il y a le logo en haut à gauche, et en dessous une barre de navigation qui s'étend sur tout votre écran. Ma question est simple : comment faire une barre similaire ? Y a-t-il un code spécifique, est-ce un jeu de CSS ?

En vous remerciant d'avance,

Cordialement

Afficher la suite

A voir également:

Comment créer une barre de recherche en html
Comment créer un groupe whatsapp - Guide
Créer un compte google - Guide
Créer une adresse hotmail - Guide
Créer un lien pour partager des photos - Guide
Créer une liste déroulante excel - Guide

7 réponses

Réponse 1 / 7

L0ci Messages postés 110 Date d'inscription Statut Membre Dernière intervention 30

Bonjour,

Tu peux créer des marges droites et gauches relatives à la largeur de l'écran (en %) et mettre la largeur de ton textbox à 100%.

Réponse 2 / 7

Bludwarf Messages postés 3 Date d'inscription Statut Membre Dernière intervention 12

Salut DrFreeze,

J'ai l'impression que cette barre de navigation (la barre bleue) est positionnée en fixed et calée sur les bords de l'écran. Un code CSS du genre doit être utilisé :

position: fixed;
margin: 0;
top: 0;
left: 0;
right: 0;
height: [la hauteur de la barre en pixels]px;

Fais attention par contre au positionnement CSS, c'est une des choses les plus galère quand on veut faire des sites web. Si tu veux un peu plus de détails je te conseille ce site très bien fait et très clair :

- https://www.alsacreations.com/article/lire/53-guide-de-survie-du-positionnement-css.html
- https://www.alsacreations.com/tuto/lire/608-initiation-positionnement-css.html#sommaire

Après tu peux aussi utiliser les outils fourni par les navigateurs pour décortiquer le code source de manière plus simple. Genre sur Chrome quand tu appuies sur F12 puis la loupe.

Bon courage ;)

Réponse 5 / 7

DrFreeze Messages postés 150 Date d'inscription Statut Membre Dernière intervention 11

Je vous remercie de vos réponses, celle de Bludwarf m'as bcp aidé et celle de Robinss aussi ;) Merci à tous !

Je balance le lien dès que je l'ai fini !

Cordialement !

Robinss Messages postés 31 Date d'inscription Statut Membre Dernière intervention 5

Content d'avoir pu t'aider, bon courage ;-)

Discussions similaires

Positionner image coin inférieur droit html !

Afficher xml dans HTML

code html pour insérer une video

créer une transition entre pages html

Caractère spécial HTML : "est différent de"

Afficher une variable javascript dans un formulaire html

Votre réponse

Discussions similaires