How to customize sidebar blocks

Hi,
i want to customize each differents blocks in the sidebar position, on the home page.

Code: Select all

<div class="box loaded" style="position:absolute...">

I've add suffix to the class of the module and create new css class but that's break all layout
All blocks loose style position

If i add style position in the new class don't work anymore...

GK_fashion v3.3

Hi,
can you give us link to your site? It will be much easier to help you.

website is in development
2013.horizons-solidaires.org

Did you add white space before suffix name in module settings ?

No suffix class is .actureg

Code: Select all

<div class="[b]box.actureg[/b]"><div><h3 class="header">Actu Régionale</h3><div class="content">

<div class="custom.actureg"  > [color=#FF0000]suffix is add in the custom div too[/color]
   <p><a href="/actualites/10-actualite-regionale/38-fete-des-pains-bio">Fête des pains Bio</a></p>
<p><a href="/actualites/10-actualite-regionale/39-frequence-afrique">Fréquence Afrique</a></p>
<p><a href="/actualites/10-actualite-regionale/40-voyage-au-vietnam">Voyage au Vietnam</a></p></div>
</div></div></div>

Style css add:

Code: Select all

.box.actureg{border:1px solid green;backround:#c6c7c8;}

nothing in line

if i insert space before suffix, bloc is in position

Code: Select all

<div class="box actureg"><div><h3 class="header">Actu Régionale</h3><div class="content">

<div class="custom actureg"  >
   <p><a href="/actualites/10-actualite-regionale/38-fete-des-pains-bio">Fête des pains Bio</a></p>
<p><a href="/actualites/10-actualite-regionale/39-frequence-afrique">Fréquence Afrique</a></p>
<p><a href="/actualites/10-actualite-regionale/40-voyage-au-vietnam">Voyage au Vietnam</a></p></div>
</div></div></div>

but style not change???
.box actureg{background-color:#c6c7c8;}

Try this code in override.css

Code: Select all

.box.actureg{background-color:#c6c7c8 !important;}


better
make a 5 px border grey... because an other div is include in.

i try this css:

Code: Select all

.box actureg{background-color:#c6c7c8 !important;}
.box actureg > div{background-color:#c6c7c8 !important;}

don't work

It isn't working becasue if you have two css classess for one lement for example:

Code: Select all

<div class="one two">


you have to use this code in css:

Code: Select all

.one.two { }


Great ! Thank's a lot i can now customise all elelments i want in the div !!!

You're the best don't forget to remember renewing my subscription!