Jump to content

Archived

This topic is now archived and is closed to further replies.

twinnax

Space between colums

Recommended Posts

twinnax

Hi

 

I am in the absolute first phase of setting up a page. The client wish to have a vertical menu and a slider on the first page. My idea was to add the menu in a column and the slider in another column based on a 2 Column section. Now the thing is that the space between the menu and the slider is not that nice. In Chrome I managed to set the margin to 0 px.

 

It looks good on the screen....

 

section id="plcolumnu453dc" data-object="PLColumn" data-sid="plcolumn" data-clone="u453dc" class="pl-section span10 offset0 my-red-area section-plcolumn pl-sortable level1" style="

    margin-left: 0px;

"

 

But I can't find a functional way to add this in the Custom LESS/CSS. Perhaps it's not possible?

 

 

Link clients.aochj.se/sanna

 

 

Share this post


Link to post
Share on other sites
vogelwild

Hi there,

 

I would suggest:

 

1. Give the second column a class name - for example "tw-col-2"

 

2. Style this class in the css file:

.tw-col-2 {
margin-left: 0 !important;
}

3. It does not look supercool now, because there is another padding in .pl-section-pad. Also style this in your css (but only for this column > .tw-col-2 .pl-section-pad):

.tw-col-2 .pl-section-pad {
padding: 0 !important;
}

4. after that, you maybe like to remove the quickslider-shadow and "border". Give the quickslider also a class name - for example "tw-start-slider" and style this in the css: 

.tw-start-slider .fslider {
background: transparent;
box-shadow: none;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
padding: 0px;}

5. Then it looks like this:

 

You could now style the text-box or content-loop below the slideshow, so that there is a left padding.

2col.png

Share this post


Link to post
Share on other sites
James B

Great advice vogelwild :-)


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
greenfly

twinnax did this work for you? 


The answer to many issues can be found by searching in the forum before posting as someone else  may very well have had the same problem before you have.  Also, reading the documentation can help you gain a good understanding of how everything works. 

 

Please do not send me private messages. Occam's razor - The principle states "Keep things simple!"

Share this post


Link to post
Share on other sites
twinnax

So sorry for my extreme late reply. Yes it worked nicely!

Share this post


Link to post
Share on other sites
James B

Excellent, glad that worked for you. Thank you for updating the thread.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

×