blog layout image left text right

Hey Martina,

This layout is the closest to what you are aiming for I think: https://kriesi.at/themes/enfold/blog/blog-single-small/. We can help you out with some custom CSS if you post a link to where we can see the elements on your actual site.

Best regards,
Rikard

Hi,

Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:

.blog a.small-preview {
    width: 180px;
    height: 180px;
}

.blog .post_author_timeline {
    display: none;
}

Best regards,
Rikard

Hi Martina,

Thanks for that. The problem with the layout I suggested is that the image is very small, maybe we could start over with another layout? Please try to activate this layout instead: https://kriesi.at/themes/enfold/blog/blog-single-author-big/. Then add this CSS to Quick CSS:

.single-big {
    max-width: 48%;
    display: inline-block;
    vertical-align: top;
}

.entry-content-wrapper {
    max-width: 48%;
    display: inline-block;
}

Best regards,
Rikard

Hi Martina,

Thanks for the screenshots, I can’t see those results on your actual site though. Did you remove the CSS again? If so then please add it back so that we can see the problem in question.

Best regards,
Rikard

Hi,

Thanks for the update. Maybe you could create a test page for us to look at?

Best regards,
Rikard

Hi Martina,

Thanks for that, it was the single-big class which was the problem. I adjusted the code a bit, please review the blog page now.

Best regards,
Rikard

Hi Martina,

You can target the blog page only, and have it not apply to mobile by using this CSS instead:

@media only screen and (min-width: 768px) {
.blog div.single-big {
max-width: 48%;
display: inline-block;
vertical-align: top;
}

.blog .entry-content-wrapper {
max-width: 48%;
display: inline-block;
}
}

Best regards,
Rikard

Hi,

Please try this CSS as well:

.home #av_section_2 .big-preview {
  max-width: 48%;
  display: inline-block;
  vertical-align: top;
}

.home #av_section_2 .entry-content-wrapper {
  max-width: 48%;
  display: inline-block;
}

Best regards,
Rikard

Hi,

Please try this instead of what I previously posted:

.home #av_section_2 .big-preview {
  max-width: 48%;
  display: inline-block;
  vertical-align: top;
}

.home #av_section_2 .standard-content {
  max-width: 48% !important;
  width: 48% !important;
  display: inline-block;
}

Best regards,
Rikard

Hi,

Updated.

Best regards,
Rikard