Columns overlapping

Home Forums Gillion Theme Columns overlapping

Home Forums Gillion Theme Columns overlapping

This topic contains 8 replies, has 2 voices, and was last updated by  Shufflehound Support 1 week, 6 days ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
  • Hi guys,

     

    I used yellow and made some changes, but here is the result. On mobiles, the middle section with 3 posts overlapping on to the section below it. Can you please suggest what I need to change to fix this? Screenshot attached:

     

    https://totalscam.com/

    Attachments:
    You must be logged in to view attached files.

    Hi @borishar,

     

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

     

    To fix it, you have to either remove the made changes as described on the below pages

     

    https://yellowpencil.waspthemes.com/docs/managing-changes-on-entire-website/
    https://yellowpencil.waspthemes.com/docs/managing-the-element-styles/

     

    Or make the changes to fix it using Yellow Pencil editor responsive mode as described below.

     

    https://yellowpencil.waspthemes.com/docs/responsive-tool/

     

    Best regards,
    Shufflehound team

    borishar
    Participant

    Hi there,

     

    I looked through everything and I can’t understand what is causing this issue. Can you please point me in the right direction? I removed columns and added them again and nothing changed. Please, help 🙂

    borishar
    Participant

    Look at the third column also. The underline goes down on the third column, even though all the character limits suppose to be the same.

    Attachments:
    You must be logged in to view attached files.

    Have you removed the changes made using the Yellow Pencil editor as described above?

    I don’t want to remove all the changes, because some of them are working fine and I don’t know what exactly is causing this issue in order to selectively remove it . Can you tell what exactly is causing this? Again, I don’t want to remove all the changes I have made by deleting

     

    Here is everything I have there. Can you tell what is causing this?

     

    /* Copyrights info */
    .sh-copyrights .sh-table .sh-copyrights-info{
    line-height:1.3em;
    text-align:left;
    position:relative;
    left:24px;
    top:-12px;
    }

    /* Copyrights logo */
    .sh-copyrights .sh-table .sh-copyrights-logo{
    position:relative;
    top:-20px;
    }

    /* Entry Content */
    #wrapper .entry-content{
    position:relative;
    top:-24px;
    }

    /* Button */
    .gsc-search-box-tools tr .gsc-search-button-v2{
    height:26px;
    }

    /* Svg */
    .gsc-search-box-tools tr svg{
    height:29px;
    width:21px;
    }

    /* Table Data */
    .gsc-search-box-tools > table > tbody > tr > td{
    border-style:none !important;
    border-top-style:none;
    border-left-style:none;
    }

    /* Table Data */
    .gsc-search-box-tools td td{
    border-style:none !important;
    border-width:0px;
    }

    /* Input */
    .gsc-search-box-tools tr input[type=text]{
    font-size:14px;
    }

    /* Heading */
    .post-readmore-text a h6{
    display:none;
    }

    /* Post readmore line */
    #content .blog-list .post-readmore-line{
    display:none;
    }

    /* Division */
    .post-readmore .sh-table-cell .jssocials > div{
    display:none;
    }

    /* Table cell */
    #content .blog-list .sh-table-cell{
    display:none;
    }

    /* Post readmore */
    #content .blog-list .post-readmore{
    display:none;
    }

    /* Heading */
    .vc_column_container .vc_column-inner .wpb_wrapper .sh-blog-fancy-title-container h2{
    display:none;
    }

    /* Division */
    #content .wpb_wrapper .sh-blog-fancy-title-container{
    display:none;
    }

    /* Table cell */
    .blog-textslider-xJHPmBuNg0 > .sh-table-cell{
    position:relative;
    top:0px;
    }

    /* Table cell */
    .blog-textslider-Jmb0K46UoZ > .sh-table-cell{
    position:relative;
    top:-20px;
    }

    /* Blog list */
    #content .wpb_wrapper .blog-list{
    height:531px;
    }

    /* Post meta content */
    .post-single-meta .post-meta .post-meta-content{
    position:relative;
    top:8px;
    }

    /* Heading */
    .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    @media (max-width:1879px){

    /* Post readmore */
    #content .blog-list .post-readmore{
    display:none;
    }

    }

    @media (max-width:1810px){

    /* Post meta content */
    .post-single-meta .post-meta .post-meta-content{
    position:relative;
    top:7px;
    }

    /* Iframe */
    #disqus_thread iframe{
    position:relative;
    top:28px;
    }

    /* Span Tag */
    .sh-copyrights .sh-table span{
    line-height:1.5em;
    }

    /* Link */
    .sh-footer .sh-copyrights .container .sh-table .sh-table-cell .sh-nav-container .sh-nav .menu-item a{
    height:714px !important;
    }

    /* Post related title */
    .blog-single .post-item .post-related-title{
    position:relative;
    top:-8px;
    }

    /* Post meta content */
    .blog-list .post-item .post-meta-content{
    position:relative;
    }

    /* Post readmore */
    #content .blog-list .post-readmore{
    display:none;
    }

    /* Post meta content */
    #content .blog-list .post-meta-content{
    top:0px;
    }

    /* Heading */
    #content .page-content .wpb_row .vc_column_container .vc_column-inner .wpb_wrapper .sh-blog-standard-posts .blog-list .post-item .post-container .post-title h2{
    line-height:1.1em !important;
    }

    }

    @media (max-width:1250px){

    /* Post meta content */
    #content .blog-list .post-meta-content{
    top:0px;
    }

    }

    @media (max-width:1205px){

    /* Heading */
    .post-single-meta .post-title h1{
    line-height:1.1em;
    }

    }

    @media (max-width:1000px){

    /* Entry Content */
    #wrapper .entry-content{
    position:relative;
    top:0px;
    }

    }

    @media (max-width:900px){

    /* Span Tag */
    .sh-copyrights .sh-table span{
    position:relative;
    left:-24px;
    }

    }

    @media (max-width:781px){

    /* Division */
    .at-above-post .addthis-smartlayers div{
    position:relative;
    top:12px;
    }

    }

    @media (max-width:776px){

    /* Division */
    .at-above-post .addthis-smartlayers div{
    position:relative;
    top:16px;
    }

    }

    @media (max-width:736px){

    /* Heading */
    .blog-single .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    }

    @media (max-width:700px){

    /* Heading */
    #content-wrapper .post-item .post-title h1{
    line-height:1.2em !important;
    }

    }

    @media (max-width:640px){

    /* Heading */
    .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    /* Heading */
    .blog-list .post-item .post-container .post-title h2{
    font-size:47px !important;
    }

    }

    @media (max-width:600px){

    /* Heading */
    .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1em !important;
    }

    /* Heading */
    #content-wrapper .post-item .post-title h1{
    line-height:1.2em !important;
    }

    }

    @media (max-width:569px){

    /* Heading */
    .entry-content #content-wrapper #content .blog-single .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    }

    @media (max-width:550px){

    /* Heading */
    #content-wrapper .post-item .post-title h1{
    line-height:1.2em !important;
    }

    /* Iframe */
    #disqus_thread iframe{
    position:relative;
    top:12px;
    }

    /* Widget title styling */
    #sidebar .widget .sh-widget-title-styling{
    position:relative;
    top:-16px;
    }

    }

    @media (max-width:500px){

    /* Heading */
    #content-wrapper .post-item .post-title h1{
    line-height:1.2em !important;
    }

    /* Post meta content */
    .post-single-meta .post-meta .post-meta-content{
    position:relative;
    top:-5px;
    }

    /* Division */
    .at-above-post .addthis-smartlayers div{
    position:relative;
    top:8px;
    }

    /* Menu Item */
    .sh-copyrights .sh-nav .menu-item{
    position:relative;
    left:8px;
    }

    }

    @media (max-width:480px){

    /* Heading */
    .sh-blog-standard-posts .blog-list .post-item .post-container .post-title h2{
    font-size:37px !important;
    }

    }

    @media (max-width:449px){

    /* Heading */
    .blog-single .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    /* List */
    #wrapper .sh-footer .sh-copyrights .container .sh-table .sh-table-cell .sh-nav-container ul{
    width:49% !important;
    }

    /* Nav container */
    .sh-copyrights .sh-table .sh-nav-container{
    width:100%;
    }

    /* Iframe */
    #disqus_thread iframe{
    position:relative;
    top:-12px;
    }

    /* Widget title styling */
    #sidebar .widget .sh-widget-title-styling{
    position:relative;
    top:-24px;
    }

    /* List */
    .sh-copyrights .sh-table ul{
    position:relative;
    left:-24px;
    }

    /* Image */
    .sh-copyrights .sh-table img{
    position:relative;
    top:8px;
    }

    /* Span Tag */
    .sh-copyrights .sh-table span{
    line-height:1.7em;
    }

    /* Link */
    #page-container #wrapper .sh-footer .sh-copyrights .container .sh-table .sh-table-cell .sh-nav-container .sh-nav .menu-item a{
    height:25px !important;
    }

    /* Heading */
    .sh-blog-standard-posts .blog-list .post-item .post-container .post-title h2{
    font-size:29px !important;
    }

    }

    @media (max-width:400px){

    /* Heading */
    .blog-single .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    /* Blog list */
    #content .wpb_wrapper .blog-list{
    padding-top:0px;
    }

    }

    @media (max-width:369px){

    /* Heading */
    #page-container #wrapper .sh-page-layout-default .entry-content #content-wrapper #content .blog-single .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    }

    @media (max-width:347px){

    /* Heading */
    .blog-single .post-item .post-item-single-container .post-single-meta .post-title h1{
    line-height:1.2em !important;
    }

    /* Heading */
    .wpb_wrapper .sh-blog-standard-posts .blog-list .post-item .post-container .post-title h2{
    font-size:24px !important;
    }

    }

    @media (min-width:901px){

    /* Copyrights logo */
    .sh-copyrights .sh-table .sh-copyrights-logo{
    width:151px;
    }

    }

    It is too much CSS and I am not sure which one exactly is affecting it.

     

    Please try removing each CSS rule one by one and test whether the issue gets resolved to find out which one is causing the issue.

    Ok thank you

    You are always welcome here 🙂

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