Blog Page Image display issue

Support
#1

Ok, so I want to make my blog page look organized and neat. Unfortunately it does not. Here is what I would like it to look like vs what it actually looks like here. Any help would be much appreciated.

Thank You

#3

Hi there,

Thanks for posting in.

Your desired layout uses the Integrity with masonry layout, plus with this custom CSS

.blog .excerpt, .p-meta span:nth-child(3):after, .p-meta span:nth-child(4) {
    display: none;
}

Its purpose is just to display a single image. Your site’s stack is integrity with masonry layout, what’s left to do is adding that custom CSS to your global custom CSS, and also add the featured images. Your other items will look empty without image.

Thanks!

#4

I added the custom css, changed it over to masonary layout, still looks scattered :frowning:

#5

Hi there,

Please change your CSS to this,

.blog .excerpt, .blog .entry-wrap {
    display: none;
}

And please upload or set feature image with uniform sizes to make sure the aspect ratio are the same.

Thanks!

#6

Worked out Great!!! Thank you very much

#7

Dont know if i should create a new thread or continure posting in here, but everything looks perfect in regards to displaying on a computer/laptop. But how it displays on a cell phone or tablet is a completely different story. How do i fix the display issue on that one? thank you

#8

Hey There,

To fix the mobile layout, please make sure of this code:

@media(max-width: 979px) {
    .x-brand img {
        max-width: 300px
    }

    .blog .entry-featured, 
    .blog .entry-featured {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

Hope this helps. Please let us know how it goes.

#9

Almost everything looks good, im just having problems with the home page since i designed with cornerstone

#10

Hey There,

I have seen your home page and I can confirm that the layout is messed up in smaller screens. This is because you have set a width in each of your text elements to at least 600 pixels.

To resolve this, please set the width to auto and maximum width to 600 pixels. And also, make sure that your left and right margin is set to auto.

Hope this helps. Please let us know how it goes.

#11

thank you i will let you know, cant get into web site bc im switching it to ssl. apologize for any inconvience. soon as i can make the change i will let you know. appreciate the help

#12

Thank you for the follow up.

#13

ok, so that didnt work unfortunately. What I would like is for the text in the box along with the box closer to the left side. Now that its on auto, it automatically centers is. Regardless switching that around did not change the look of it on a cell phone. still looks all scattered. Website is back up and running. any support would be appreciated… thank you much

#14

Hi there,

You can remove the Auto options from the margin and add percentage values there is you want. I honestly don’t understand what you mean by scattered. I think it will be better if you give us case by case problems with screenshots and say how you would like it to be.

Meanwhile please consider that you always have the Hide/Show on breakpoint option at hand to add mobile-specific blocks if you struggle to have the blocks look ok both ways.

Finally, kindly open up new threads for additional questions as it will help us to focus on each issue and give you a better support which you deserve. Having a long threads makes the maintaining job harder and also it will be harder for the other customers to find the correct information if they have similar issues. You are always welcomed to reply to this thread to follow up the same question.

Thank you.

#15

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.