Jump to content

[RESOLU] Help CSS pour centrer et Inline


Recommended Posts

Bonjour,

 

Sur la home page de mon site www.french-food.com, j'ai une ligne "Buy French Food Online - Free shipping over $50.00 within the US".

 

Cette ligne contient le H1 de ma home page et est codée comme cela :

 

 

<h1 style="display: inline; ">{l s='Buy French Food online' mod='homefeatured'}</h1><p style="display: inline;"><span style="font-size: 18px; color: #000000;">{l s=' - Free Delivery over $50 within the US' mod='homefeatured'}</span></p>

 

J'aimerai centre cela mais text-align:center ne fonctionne pas.

 

Quelqu'un a t'il une idée ?

 

Merci d'avance.

Edited by MYFRENCHNEIGHBOR (see edit history)

Share this post


Link to post
Share on other sites

Encadrer l'ensemble par une <div> avec "width:100%;text-align:center" ou "margin-left:auto;margin-right:auto;" ou "margin: 0 auto;"

 

<div style="margin: 0 auto;">
 <h1 style="display: inline; ">{l s='Buy French Food online' mod='homefeatured'}</h1><p style="display: inline;"><span style="font-size: 18px; color: #000000;">{l s=' - Free Delivery over $50 within the US' mod='homefeatured'}</span></p>
</div>

 

De plus, les balises <p> et <span> ne semblent pas nécessaires, tu peux tout mettre à la suite dans le <h1> et à ce moment la tu lui applique directement un "margin-left:auto; margin-right:auto;"

Edited by Mellow (see edit history)

Share this post


Link to post
Share on other sites

Guest Kaylabs

A noter qu'il vaut mieux eviter de mettre du css directement dans le html, ca evite de devoir editer css ET tpl pour changer une mise en page

 

Ce qui donne pour le html comme l'a dit Mellow: encadrer le tout d'un div auquel on attribue une nouvelle class:

<div class="centrage">
<h1>Buy French Food online</h1><p><span> - Free Delivery over $50 within the US</span></p>
</div>

 

Puis dans le css, ligne 1749 du global.css, rajouter le display:inline pour H1:

.banner h1 {
color: #000000;
font-size: 18px;
font-weight: normal;
line-height: 20px;
display: inline;
}

 

puis quelques nouvelles rules:

div.centrage { text-align: center; }

.banner p { display: inline; }

.banner p span { font-size: 18px; color: #000; }

Edited by Kaylabs (see edit history)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More