How to change width of side module

Danimeeka
Active member
Topic Author
Member

11 years 11 months ago #30206 by Danimeeka

How to change width of side module was created by Danimeeka

Hi,

What is the best way to change the number of columns that the left side module occupies? My website ( 184.154.224.13/~harpsint/ ) has navigation on the left that my client would like to be narrower. If it currently occupies 5 columns, how do I reduce it to 4?

Thanks!

Please Log in to join the conversation.

ivan.milic
Support Staff
Moderator

11 years 11 months ago #30216 by ivan.milic

Replied by ivan.milic on topic How to change width of side module

You have that is carousel? You can chose ratio for each slide in module settings.

Please Log in to join the conversation.

Danimeeka
Active member
Topic Author
Member

11 years 11 months ago #30266 by Danimeeka

Replied by Danimeeka on topic How to change width of side module

Hi Ivan,

Actually it is the left side menu I want to make narrower. Sorry - I wasn't very clear.

Thanks.

Please Log in to join the conversation.

ivan.milic
Support Staff
Moderator

11 years 11 months ago #30277 by ivan.milic

Replied by ivan.milic on topic How to change width of side module

Open index.php of template,

You have:

<div class="five columns hotside">
<jdoc:include type="modules" name="left" style="xhtml" />
</div>

... and ....

<div class="four columns hotside">
<jdoc:include type="modules" name="left" style="xhtml" />
</div>

you see classes five and four you can change this. This is definition of that classess in templates/hot_wedding/css/skeleton.css:

Code:

    /* Base Grid */
    .container .one.column,
    .container .one.columns                     { width: 40px;  }
    .container .two.columns                     { width: 100px; }
    .container .three.columns                   { width: 160px; }
    .container .four.columns                    { width: 220px; }
    .container .five.columns                    { width: 280px; }
    .container .six.columns                     { width: 340px; }
    .container .seven.columns                   { width: 400px; }
    .container .eight.columns                   { width: 460px; }
    .container .nine.columns                    { width: 520px; }
    .container .ten.columns                     { width: 580px; }
    .container .eleven.columns                  { width: 640px; }
    .container .twelve.columns                  { width: 700px; }
    .container .thirteen.columns                { width: 760px; }
    .container .fourteen.columns                { width: 820px; }
    .container .fifteen.columns                 { width: 880px; }
    .container .sixteen.columns                 { width: 940px; }

    .container .one-third.column                { width: 300px; }
    .container .two-thirds.column               { width: 620px; }

Please Log in to join the conversation.

Time to create page: 0.162 seconds