Centrer bouton en html

Fermé
loulou - 13 juil. 2010 à 16:04
 loulou - 28 juil. 2010 à 09:01
Bonjour,

j'ai fait des boutons en html le rendu est pas trop mal sauf que je n'arrive pas à les centrer dans ma page ... ils sont tout à gauche et avec les balises <center> et </center> impossible ça ne marche pas que dois je faire ??



<p> <div style="float:left"><button> <font color="#8000ff"><font size ="4"><font color ="#000066"> Accueil</font color></fontsize></button></div>

<div style="float:left"><button> <font color="#8000ff"><font size = "4"> <font color ="#000066">Présentation </font color> </font size></button></div>

<div style="float:left"><button> <font color="#8000ff"><font size = "4"> <font color ="#000066">Produits et services </font color> </font size></button></div>

<div style="float:left"><button> <font color="#8000ff"><font size = "4"> <font color ="#000066"> Infos pratiques </font color> </font size></button></div>

<div style="float:left"><button> <font color="#8000ff"><font size = "4"> <font color ="#000066">Nous contacter </font color> </font size></button></div> </p>







A voir également:

32 réponses

will5555 Messages postés 332 Date d'inscription samedi 2 août 2008 Statut Membre Dernière intervention 20 août 2013 45
15 juil. 2010 à 11:07
Je te conseille de suivre ces cours https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3

J'ai étudié les principaux langages web : html/css, php, javascript durant mon dut et les cours de html/css était bien pompé sur ce site.

Ces cours sont sympas, bien expliqué de quoi devenir un vrai pro ;-)
3
fxtaa Messages postés 1050 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 2 avril 2015 74
Modifié par fxtaa le 13/07/2010 à 16:20
Salut, utilise le css ;)
<style> 
button{  
 color:#000066; 
} 
#conteneur { 
  
 text-align:center; 
} 

</style> 

<div id="conteneur"> 
  
  <button>Accueil</button> 
  <button>Présentation</button> 
  <button>Produits et services</button> 
  <button>Infos pratiques</button> 
  <button>Nous contacter</button> 
  
</div>
0
merci à vous 2

malheureusement aucun des 2 ne marchent
le premier ça me mets tou à gauche les bouton les un en dessous des autres .. ou alors c'est moi qui fait n'importe quio!! je débute je précise
le 2 ème ça me met pas en centré et en plus les boutons sont un peu plus petits et moins jolis je trouve!!
y a pas de solution à mon problème ?? ouin ouin
0
fxtaa Messages postés 1050 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 2 avril 2015 74
Modifié par fxtaa le 13/07/2010 à 16:40
Le problème ne vient pas la alors, car lorsque je copie colle mon code dans une page html vierge, ceux ci sont bien centré au milieu de la page.

Donne nous toute ta page ce sera plus simple.
0
merci beaucoup ça y est ça marche j'avais en plus fait une erreur ailleurs !! donc cool merci à vous ça marche super !!
par contre un tuyau pour que ça marche sur les autres navigateur que IE ? car j'aiperu que ça ne marche pas surles autres !!merci d'avance ;)
0
fxtaa Messages postés 1050 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 2 avril 2015 74
Modifié par fxtaa le 15/07/2010 à 11:04
C'est souvent l'inverse : ca fonctionne sur tous les navigateurs sauf ie.

La meilleure solution est de faire 2 feuilles de styles css, une pour les navigateurs normaux et une pour ie. Ensuite sur ta page internet tu rajoutes :

<link rel="stylesheet" type="text/css" href="ressources/style.css">  
  <!--[if IE]>  
  <link rel="stylesheet"; type="text/css" href="ressources/style-ie.css">  
  <![endif]-->
0
Breub62 Messages postés 2989 Date d'inscription lundi 7 juin 2010 Statut Membre Dernière intervention 17 avril 2014 369
15 juil. 2010 à 11:08
Tu peux aussi jouer avec les hacks css...
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
merci beaucoup à vous deux je vais aller voirle site du zéro
et pour les eux feuilles de styles je dois mettre dans chacune exctement le même code css c'est ça ?
0
Link56 Messages postés 105 Date d'inscription mercredi 9 juin 2010 Statut Membre Dernière intervention 20 juillet 2011 2
27 juil. 2010 à 14:56
exelent site le "site du Zér0"
bon choix!
0
will5555 Messages postés 332 Date d'inscription samedi 2 août 2008 Statut Membre Dernière intervention 20 août 2013 45
15 juil. 2010 à 15:26
En faite en général ont fait deux feuilles une pour internet explorer et une pour les autres navigateurs.

Chaque navigateurs à ça propre façon d'interpréter le css, il est donc souvent très difficile d'avoir une feuille css qui donne un même rendu sur tous les navigateurs.

C'est pour ça que beaucoup de monde n'aime pas Internet explorer, il interprète trop différemment le code comparé aux autres navigateurs.
0
en fait j'arrive à le faire marcher aevc le code

<style>
button
{
color:#000066;

font-size :20;




}
#conteneur {

text-align:center;
}

</style>

<div id="conteneur">

<button>Accueil</button> </a>
<button>Présentation</button>
<button>Produits et services</button>
<button>Infos pratiques</button>
<button>Nous contacter</button>

</div>

mais impossible de les rendre clicables vers une autre page html..
par exemple si je suis sur acceuil eet que je clique sur présentation je voudrais que ça ouvre la page html présentation et ainsi de suite.. je n'ay arrive pas !!
pouvez vous m'aider merci ;)
0
will5555 Messages postés 332 Date d'inscription samedi 2 août 2008 Statut Membre Dernière intervention 20 août 2013 45
23 juil. 2010 à 15:34
parsque pour faire un lien on fait
<a href="www.google.fr"> lien vers google </a>
0
je l'ai fait ça ne marche pas ... quand je clique sur le bouton il ne se passe rien.. ça n'ouvre pas l'autre page html où ça devrait aller .... peux tu me dire où le placer exactement dans mon code car là je patoge..merci ;)
0
<a href="../Accueil.htm"><button>Accueil</button></a>
<a href="../Presentation.htm"><button>Présentation</button></a>
....
0
Ecoute je suis quasi sure que c'est ce que j'ai fait ça n'a pas marché d'où mon incompréhension totale je vais réessayer ... ;)
0
non ça ne march pas !! dsl mais je n'y comprends rien du tout !!aidez moi svp !!! merci
0
Profil bloqué
24 juil. 2010 à 15:18
si tu fais exactement cette syntaxe et que ça marche pas ça veut dire que tu t'es trompé, forcément sur le chemin vers ta page.
0
MicroStoretm Messages postés 8 Date d'inscription vendredi 23 juillet 2010 Statut Membre Dernière intervention 26 juillet 2010
24 juil. 2010 à 15:59
Bonjour A Toi, je crois detenire la solution a ton Probleme, en faite si j'ai bien compris
tu veux que tout tes boutont soit centrer.
Si tu as un fichier css rajoute ceci :
input
{
margin: auto;
}
0
fxtaa Messages postés 1050 Date d'inscription mardi 20 octobre 2009 Statut Membre Dernière intervention 2 avril 2015 74
26 juil. 2010 à 15:22
Salut, pour qu'un margin auto fonctionne, la balise doit avoir un width de définit si je ne dis pas de bêtises.
0
merci mais ça c'est résolu merci quand même
maitenant c'est un lien vers une une autre page html que je veux et qui ne fonctionne pas... en fait je veux des boutons clicable mais ça nemarche pas ...
merci
0
MicroStoretm Messages postés 8 Date d'inscription vendredi 23 juillet 2010 Statut Membre Dernière intervention 26 juillet 2010
Modifié par MicroStoretm le 24/07/2010 à 16:12
Et pas je te recomande ce code :

<input type="button" href="page.html" value="Ma page"/>
0
pardon mais là je ne connais pas value ="ma page" c'est par es value ="Présentation " dans mon cas ??
ça me change tout le code pour la barre en haut ? non ?
je suis novice c'est pour ça... merci ;)
0
ça ne marche pas non plus ... c'est un truc de fou quand je clique ça reste sur accueil ça ne va pas sur présentation...
en plus le code css pour centrer peut il pmarcher dessu aussi ???
aidez moi svp à rendre mon bouton clicaable surle bon lien ! merci ;)
0
will5555 Messages postés 332 Date d'inscription samedi 2 août 2008 Statut Membre Dernière intervention 20 août 2013 45
25 juil. 2010 à 17:33
la page d'accueil exist-elle au moins?

Parsque si le <a href=""></a> fonctionne pas c'est qu'il y'a une faute dans le html plus haut
0
ben oui elle existe .... ;) c'est pour ça que je n'y comprends rien de rien !!!
j'ai mis le <a href=" " avant pour essayer mais sans le </a> de fin et là ça me met par exemple présentation en lien souligné et ça ouvre bien par ex présentation si je clique desssus mais le bouton encadré disparé complètement ....
0
ben oui elle existe .... ;) c'est pour ça que je n'y comprends rien de rien !!!
j'ai mis le <a href=" " avant pour essayer mais sans le </a> de fin et là ça me met par exemple présentation en lien souligné et ça ouvre bien par ex présentation si je clique desssus mais le bouton encadré disparé complètement ....
0