Home Forums Weaver Xtreme Theme Creating Columns

Topic Resolution: Resolved
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #69353
    Skippy
    Participant

    Greetings.

    Here is the page I’m working with.  There will be more pages with the same layout so I’m looking for a method I can easily modify and change all the pages at once.

    Conflict Management for Project Managers

    I am attempting to create column.  Right now I’m going with 30% and 70% for the widths.  I suspect this might change, but it will get me there for now.

    I pulled my starting CSS from https://guide.weavertheme.com/responsive-columns-and-widgets/ then played about with modifying it.

    Where I am now has two problems.

    1. The right column shifts to under the left column once the left column text is done.  I want the right column to stay to the right.
    2. The bulleted list is shifting too far left.

    Code improvements or better ways to do this requested. I do have the Pro plugin.  Thank you!

    #69355
    scrambler
    Moderator

    You have a typo in you 70% columns CSS

    .content-2-co-70l, .is-mobile .content-3-col {
    float: left;
    width: 70% !important;;
    overflow: hidden;
    padding-right: 2%;
    padding-left: 4% !important;
    }

    You also need to add the box-sizing CSS to both rules so the padding does not get added to the width, and you dont need the is-mobile selector

    .content-2-col-30 {
    float: left;
    width: 30% !important;
    overflow: hidden;
    padding-right: 4% !important;
    padding-left: 0% !important;
    box-sizing: border-box;
    }

    .content-2-col-70 {
    float: left;
    width: 70% !important;
    overflow: hidden;
    padding-right: 2%;
    padding-left: 4% !important;
    box-sizing: border-box;
    }

     

    #69368
    Skippy
    Participant

    Ah yes…  the typo problem.  Thanks for catching that.  Much appreciated!

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.