Theme responsive et CSS

[kelrobot]

Bonjour,

 

j'ai un thème responsive http://demo.presthemes.com/#andalo et j'essaye d'ajouter des images dessus.

 

Voici l'adresse de mon site en phase de développement : www.boutique.kelrobot.fr

 

J'ai ajouté par exemple le logo de paiement sécurisé dans le header. Comme je ne suis pas très bon en CSS, j'ai quelques problèmes. Sur mon écran, le logo s'affiche correctement à la bonne position mais selon les résolutions d'écran, le logo s'affiche plus ou moins correctement.

 

Que faut-il faire pour rester responsive ?

 

Voici mon code :

 

#header_logo_paiement {
  float:right;
  margin-top:30px;
  margin-right:270px;
}

 

[...]  
<div id="header_logo_paiement" >
		    <img src="http://www.boutique.kelrobot.fr/themes/andolo/img/cms/paiement-securise.gif" border="0" align="bot" ></img>		
</div>
[...]

 

Merci d'avance

[Vinum]

Bonsoir,

Il y'a plusieurs choses à reprendre. Soit tu diminues la taille de ton logo principal, soit tu augmentes la hauteur du header afin de pouvoir dans un premier temps descendre ton logo de paiement.

Il faudra également descendre la ligne séparative.

Puis il faut aligner ton logo de paiement à gauche et non à droite.

[Vinum]

Bonjour,

Sympa !!

On répond et plus de nouvelles !!!!

[kelrobot]

Salut,

 

désolé je n'avais pas vu la réponse !

 

En fait, ce qu'il fallait faire : Utiliser top et right au lieu de margin-top et margin-right et le mettre en absolute !!

 

Merci en tout cas

[Vinum]

Je viens d'aller voir ton site et ta solution n'est pas responsive. Sur un smart phone ton logo des paiements chevauche ton logo.

[kelrobot]

Peux-tu m'indiquer la marche à suivre pour qu'il devienne responsive ? J'ai aligné à partir de la gauche mais je sais pas trop quoi faire de plus.

 

Merci.

[Vinum]

Bonsoir,

Le problème c'est que tu as dû modifier pas mal de trucs dans le header donc il y'a pas mal de trucs à revoir.

Essaies de mettre des pourcentages plutôt que des pixels.

[kelrobot]

Bonjour,

Je n'ai pas modifié tant de chose que ça dans le header. J'ai uniquement remonté un peu le champ de recherche et ajouté le logo de paiement sécurisé.

 

J'utilise maintenant les pourcentages, c'est un peu mieux mais pas encore parfait.

 

Merci en tout cas.