Column margin problem.

Home Forums Jevelin Theme Column margin problem.

Home Forums Jevelin Theme Column margin problem.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
  • roobinda
    Participant

    I am performing a very basic test which has an odd result.

    Using page builder, i have created a section which has padding set to 0. Within this i have 3 one third columns, all with padding set to 0.

    I would like a 4px space between these, so the first column has a the right margin set to 2px, the second has left margin 2px and right margin 2px, and the third column has left margin 2px.

     

    Please tell me why the result would be that the third column is pushed below the other two. How is it possible? The columns do not have a fixed width.

     

    <mark>https://snag.gy/wB4tNI.jpg</mark&gt;

     

    I am really confused!

     

    In addition, adding a 1px right margin to the left column in a 2 column element seems to have bizarre results as well. Pushing the right column beneath the left one and increasing their height by about 300%!

     

    Why is this? What am i doing wrong?

     

     

     

    Hi @roobinda,

     

    I hope you are well today and thank you for your question.

     

    Could you please share me the page URL from your site where it is not displaying correctly so that i can troubleshoot it?

     

    Best regards,
    Shufflehound team

    roobinda
    Participant

    thelostdisco.co.uk

    roobinda
    Participant

    I sent the login credentials to [email protected]

    I got your log in credentials and site URL but could you please share me the specific page URL from your site where it is not displaying correctly so that i can troubleshoot it?

    roobinda
    Participant

    The URL is thelostdisco.co.uk The problem is on the home page (HOME BASIC in WP ADMIN).

    Below the ‘location’ header, if you set a margin on the FESTIVAL SITE column it pushes the TISNO TOWN element beneath it and increases the height of both elements. Shouldn’t it simply create a gap between the two and adjust their width, keeping them both inline?

     

    The STAGE elements have the same problem – setting margins forces the third element in the line to drop down. Surely they should adjust and stay 3 to a line?

     

    All of these elements also have the shadow hover turned on, but it’s not working.

    Solution for this topic

    It seems the issue of Unyson framework that we need to troubleshoot more.

    In the meanwhile you can set the margin to these elements displayed on the home page of your site by adding the following CSS code in the Custom CSS code option of your theme on the below path.

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

    @media (min-width: 768px){
    body.home .sh-section-7f9dce084d0526e8808ea49ca6f36edf .fw-col-sm-6 {
        width: 49%;
        margin: 0 0.5%;
    }
    
    body.home .sh-section-7cebbbbd04f2fd5f016bae6daf667582 .fw-col-sm-4 {
        width: 32.33333333%;
        margin: 0 0.5%;
    }
    }

    roobinda
    Participant

    Has this problem with Unison been fixed in the latest theme update?

    It’s Unyson problem so hard to fix in the theme but we’ll try to do it soon in the theme and update you here.

    roobinda
    Participant

    Okay great. Thank you.

     

    I have more sections on my site that I may wish to apply your margin code to. How do I find out the relevant classes, like .sh-section-7f9dce084d0526e8808ea49ca6f36edf for these sections?

     

    Many thanks.

    You have to use browser inspector to find out that class as described on the following pages.

     

    http://atendesigngroup.com/blog/how-determine-which-css-styling-element

    http://kb.oboxthemes.com/articles/how-to-get-css-styles-for-elements/

Viewing 11 posts - 1 through 11 (of 11 total)