-
AuthorPosts
-
May 3, 2017 at 3:33 pm #787193
https://kriesi.at/support/topic/website-two-column-blog-not-displaying-properly-in-mobile/
I already made a thread for this. However, it’s not actually displaying properly. The blog posts are irregularly spaced vertically. Every other post is now too high or too low. I would like all blog posts to be the same spacing on mobile, if possible. Between the dates and the pictures, the spacing is different from one post to the next.
Thanks,
Brendon
May 4, 2017 at 12:45 am #787493Hey feoleb,
Try adding this css code in Quick CSS (located in Enfold > General Styling):
@media only screen and (max-width:767px) { #top .slide-entry-wrap { margin-bottom: 0; } }
Hope this helps :)
Best regards,
NikkoMay 10, 2017 at 3:45 pm #791161Hello,
I did that and the spacing is still different. It seems odd that having multiple columns on blog posts doesn’t work correctly as that’s one of the built-in features for enfold. Is it supposed to work correctly by default? I wonder if maybe some other custom css I have would be messing it up.
/*this is so that the logo image of the menu does not appear*/ .logo { display: none; } /*This is so that the header container which adds a space and border for the header logo does not show*/ .container.av-logo-container{ display:none!important; } /*This adds some padding to the bottom of the posts so that the 'read more' button isn't cut off*/ .slide-entry-excerpt { padding-bottom:32px; } /*this is so that the blog displays properly when the screen is smaller width like on mobile devices*/ @media only screen and (max-width: 767px) { .page-id-162 .slide-entry { width:100% !important; margin-left:0 !important; } } /* add padding to the top of blog posts so they display correctly in mobile mode */ article.slide-entry.flex_column.post-entry{ padding-top:32px !important; } /* change blog post navigation button color and font color*/ .avia-post-nav { background: #c3512f !important; color: white !important; } /*display blog next previous arrows in mobile view and make them smaller and not show a preview*/ @media only screen and (max-width:767px) { .responsive #top .avia-post-nav { display: block !important; opacity: 0.8; margin-top:-70%; height: 30px; } /*also this makes it so the button doesn't expand when you click on it in mobile because it doesn't display right in that mode */ .responsive #top .avia-post-nav .entry-info-wrap * { display: none !important; } .responsive #top .avia-post-nav .entry-info-wrap { display: none !important; } } /*Change large button minimum width for front page 'start at the begging or see latest articles' buttons to be the same size*/ .avia-button.avia-size-large { min-width: 290px; } @media only screen and (max-width:767px) { #top .slide-entry-wrap { margin-bottom: 0; } }
May 10, 2017 at 4:48 pm #791203Hi,
If that’s the case, please post us your login credentials (in the “private data” field), so we can take a look at your backend.
Login credentials include:
- The URL to the login screen.
- A valid username (with full administration capabilities).
- As well as a password for that username.
- permission to deactivate plugins if necessary.
Best regards,
NikkoMay 11, 2017 at 9:17 pm #791916Hello,
Can you confirm if this is not a problem out of the box?
Thanks,
Brendon
May 12, 2017 at 8:02 am #792127Hi,
Yes, I think it’s more of a caching issue, most likely caused by WP Fastest Cache. Quick CSS’ code appears in this cached css file produced by the plugin, you can check on the link and you should see the code you’ve posted above except the one I gave you.
Best regards,
Nikko -
AuthorPosts
- You must be logged in to reply to this topic.