Home › Forums › Gillion Theme › Columns overlapping
Home › Forums › Gillion Theme › Columns overlapping
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:
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
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 š
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 š