[RESOLU]Supprimer le fond blanc du header

[Chrysn91]

Bonjour la communauté,

 

Après pas mal de recherche, je vous sollicite...

 

lorsque je mets la couleur (blanche) en fond dans #page du global.css, j'obtiens un problème sur le header==> Voir fichier attaché.et pour le moment, je sèche...

 

je souhaite conserver le fond blanc sur toute la partie en dessous du header et que ce dernier conserve sa transparence.

Y'a t-il un moyen simple de le faire?

 

Par avance merci

 

[DeyDDy]

Bonjour Chrysn91

 

Dans votre global.css (la ligne 509 pour le thème Prestashop_new)

 

ajouter après #header {

Background: none repeat scroll 0 0 transparent;

[Chrysn91]

Bonjour DeyDDy,

 

 

Merci pour la réponse mais je n'ai pas #header a cette ligne je suis plutôt dans

 

/* exclusive button */

input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large,

input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled,

a.exclusive_mini, a.exclusive_small, a.exclusive, a.exclusive_large,

span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled {

color: white!important

}

 

Probablement une autre ligne!

 

je suis en PS 1.4.4.1 theme par défaut

[DeyDDy]

  On 2/13/2012 at 5:46 PM, Chrysn91 said:

Bonjour DeyDDy,

 

 

Merci pour la réponse mais je n'ai pas #header a cette ligne je suis plutôt dans

 

/* exclusive button */

input.exclusive_mini, input.exclusive_small, input.exclusive, input.exclusive_large,

input.exclusive_mini_disabled, input.exclusive_small_disabled, input.exclusive_disabled, input.exclusive_large_disabled,

a.exclusive_mini, a.exclusive_small, a.exclusive, a.exclusive_large,

span.exclusive_mini, span.exclusive_small, span.exclusive, span.exclusive_large, span.exclusive_large_disabled {

color: white!important

}

 

Probablement une autre ligne!

 

je suis en PS 1.4.4.1 theme par défaut

 

Regardez sur la ligne 233

[Chrysn91]

Je viens de regarder et voilà ce que j'ai ==> voir PJ

 

j'ai essayer d'insérer le code mais sans résultat

[DeyDDy]

==>Inséré le code comme suit

 

Juste après img.logo {

-----------------

-----------------

-----------------

}

#header {

background: none repeat scroll 0 0 transparent;

height: 00px;

float: left;

margin-bottom: 00px;

width: 000px;

text-align: right

}

Juste avant

#left_column, #center_column, #right_column { float: left }

 

a vous après de définir la largeur et la hauteur

[Chrysn91]

Malheureusement çà ne fonctionne pas. Ai-je fait une faute?!

le nouveau CSS:testé les 2 positions ci-dessous

 

img.logo {

float: left;

margin-top: 0.5em;

font-size: 2em;

font-weight: bold

}

là ==>

 

#header {

background: none repeat scroll 0 0 transparent;

height:180px;

float: left;

margin-bottom: 50px;

width: 980px;

text-align: right

}

#header_right {

float: left;

margin-bottom: 15px;

width: 73%;

text-align: right

}

ou là ==>

 

#header {

background: none repeat scroll 0 0 transparent;

height:180px;

float: left;

margin-bottom: 50px;

width: 980px;

text-align: right

}

#left_column, #center_column, #right_column { float: left}

 

Je rappelle que la couleur du background de #page est blanche.

Le logo est une image .png avec la transparence

derrière, le background du body est une image.jpg

 

Merci pour votre aide et patience

[DeyDDy]

Avez vous forcer la compilation?

[Chrysn91]

Bonjour DeyDDy,

 

Oui la compilation est forcée par défaut puisque ce sont des tests en local.

Ça devrait fonctionner avec ce code placé a cet endroit ?!!!

[Chrysn91]

Up ! help !

[DeyDDy]

Bonjour

 

Le temps pour moi de récupérer une version 1.4.1

 

Essayez la manip suivante: a la ligne 227 de votre global.css

 

supprimer le_right et garder simplement #header {

 

ensuite inséré le code que je vous ai fourni plus haut

 

un lien serait la bienvenue

[Chrysn91]

Merci,

 

je viens de faire la modification et le test est négatif, rien de changé en bien ou mal

je vous joins le lien : l'arche de choupinou

 

je vous précise que le fond blanc est visible qu'en local,

comme sur l'image en pièce jointe mise précédemment.

[lordexquisit]

Bonsoir

 

Essayez ceci:

 

Cherchez:

 

#header {position:relative}

 

Remplacez par:

 

#header {

position:relative;

background-color:transparent

}

 

Celà devrait fonctionner.

[Stéphane Chonez]

bonjour,

 

pourquoi ne pas simplement mettre un fond sur la <div id="column"> ?

 

insérez ce code après le #page de la ligne 210 du globall.css :

#page {
   text-align: left;
}
#column{
background-color:#fff;
}

[Chrysn91]

Bonjour à tous,

 

merci pour vos contributions et votre investissement sur ce problème.

 

@lordexquisit => malheureusement çà ne fonctionne pas

 

@ Stéphane Chonez:

  Quote

bonjour,

 

pourquoi ne pas simplement mettre un fond sur la <div id="column"> ?

 

insérez ce code après le #page de la ligne 210 du globall.css :

#page {

text-align: left;

}

#column{

background-color:#fff;

}

 

J'ai parlé trop vite, j'avais oublié de faire une modif dans mon CSS

 

Ça ne fonctionne pas non plus

 

Par contre quand je modifie comme ci-dessous

 

#left_column, #center_column, #right_column {

background-color:#fff;

float: left;

}

Ca fonctionne!

[Stéphane Chonez]

bonjour,

 

pour l'image de fond testez celà :

 

#column{
background: #fff url(../img/image.jpg) no-repeat 0 0;
}

 

en adaptant selon si l'image se répète et en modifiant le nom de l'image.

[Chrysn91]

  On 2/16/2012 at 10:33 AM, Stéphane Chonez said:

bonjour,

 

pour l'image de fond testez celà :

 

#column{
background: #fff url(../img/image.jpg) no-repeat 0 0;
}

 

en adaptant selon si l'image se répète et en modifiant le nom de l'image.

 

merci, par contre je n'ai jamais compris pourquoi on laisse le code couleur avant l'image?

[Stéphane Chonez]

si ton image est lourde, le temps de l'afficher le fond sera blanc

[Chrysn91]

  On 2/16/2012 at 11:37 AM, Stéphane Chonez said:

si ton image est lourde, le temps de l'afficher le fond sera blanc

Merci