Sizing Issue in Mobile - Recent Posts

Support
#1

Hello,

I am using the shortcode of “Recent Posts” in integrity. I am not sure why, but in the mobile view, the sizing is way off. I cannot see where to make the correction in CSS for mobile. I did find what was off, see image #2. Image #2 is in the inspect mode. Image #1 is the problem. Image #3 is in computer view which is great.

Can you please let me know where the CSS for mobile is, to make the correction. I am terrible at CSS problem-solving. Thanks for your help.

Image #1
Image #1468×704 194 KB
Image #2
Image #21282×672 277 KB
Image #3
Image #31362×554 144 KB

Here are the two websites with the same problem.


#2

Hello Bret,

Thanks for writing in!

You have added the classic recent posts shortcode inside the content area element. You must know that content area element does not have a maximum width. There is also no option in the content area settings. To get this issue resolve, you will need to insert a maximum width of 100% for the content area. To do that, go to “Customize” tab:

  • XNSLtiRlQnG_Rx-hLTRtqA

And then insert this element css:

$el {
  max-width: 100%;
}

This will make sure that the content area will always have a 100% width of the container and will not exceed this width which is what is happening in your footer now.

If this is not helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
To know how to create a secure note, please check this out: https://theme.co/docs/getting-support

We would love to know if this has worked for you. Thank you.

#3

Hey, thank you for the info and the tip. I was able to do as you recommended and on one site “Sports Team History” it did work, however on the other site “Sports Logo History” the CSS did not work.

Would not the same code work in both sites? Thanks again for your help.

#4

Hello Bret,

For https://sportslogohistory.com please try:

$el .x-bar-content-area {
    max-width: 100%;
}

Hope this helps.

#5

Thank you, that was it. You’re the best.

#6

Hi Bret,

In case you wanna read more about the Element CSS feature, please check here:

Glad to hear it’s sorted.

#7

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