Eliminate Scroll Bar on Front Page Featured Image

aestheticwebdesigner · Member · Mar 1, 2019 at 1:58 am
Copy link

Add topic to favorites
Hello,

I’m using the Sela Theme. The blog is aestheticsdesignerconsulting.com

On a laptop, when the computer screen is made somewhat smaller, a scroll bar appears on the home page featured image. Why is that?

What is the CSS to make the home page more responsive so that that scroll bar does not appear?

The blog I need help with is aestheticsdesignerconsulting.com.

The blog I need help with is: (visible only to logged in users)
aestheticwebdesigner · Member · Mar 1, 2019 at 1:59 am
Copy link
The blog I need help with is aestheticsdesignerconsulting.com.
marlowedays · Member · Mar 5, 2019 at 5:50 pm
Copy link
Hi Aestheticwebdesigner,

I was able to replicate the issue when I reduced my browser screen size to this range: 768px – 807px. Here’s a screenshot (https://imgur.com/a/FVCW8er).

Here are the possible solutions that you can try using custom CSS (My Sites → Customize → CSS):

1. Hide the vertical scroll bar using the overflow CSS property:
```
@media screen and (min-width: 768px) {
.hero-content-overlayer {
overflow-y: hidden !important;
}
}
```
2. Increase the width of the white box (Affordable web design by):
```
@media screen and (min-width: 768px) {
.front-page-content-area .with-featured-image {
width: 45% !important;
}
}
```
3. Decrease the font size of the elements inside the white box:
```
#post-103 .entry-content {
font-size: <strong>90%</strong>;
}
```
or
```
#post-103 .entry-content {
font-size: <strong>14.8px</strong>;
}
```
Let me know if there’s anything else I can help you with.
portlandstudygroup · Member · Mar 5, 2019 at 6:34 pm
Copy link
You are so kind to respond.

I thought no one was going to respond to my question, so I ended up just changing the design. I had adjusted the overlay box and font sizes, taken out text, etc. And I already had a media query in place, so I don’t think I would want to mess with that now since the site is just about finished.

However, I use the Sela theme often, so I will keep this information for future times. (So…your time was not for naught. :-)

No items found.