# Really Nice Feature

**URL:** <https://forum.pinegrow.com/t/really-nice-feature/2498>\
**Category:** Beginners\
**Created:** [December 9, 2018, 4:45pm UTC](https://forum.pinegrow.com/t/really-nice-feature/2498 "2018-12-09T16:45:05Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\
**Post date:** [December 9, 2018, 4:45pm UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/1 "2018-12-09T16:45:05Z")

</div>

I just published an update to a site I built last June and notice that the pages that include an iframe used to have scrollbars on my iPhone 6. Now there are no scroll bars on either the old or on the new site – the iFrame height is auto-expanded to include all the content regardless of size.  
My iPhone been updated by Apple recently and I wonder if this remedied the annoying scrollbars? Would someone please visit [https://faithcentre.info](https://faithcentre.info) (old site) or [https://faithcentre.info/fcnew](https://faithcentre.info/fcnew) (new site) to see if the scrollbars display on your devices? Try the Home, Events, and Wellness pages. Curious if this is happening on just my iPhone or if it also occurs on Droids.

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [December 9, 2018, 5:56pm UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/2 "2018-12-09T17:56:28Z")

</div>

hi @randyrie, all good on an Android Fone (dont ask what version, not the latest, but fine.  
Checked both sites…and AMAZING! … You’re American but

KNOW HOW TO SPELL CENTRE CORRECTLY! (not that **CentER** version that throws me all the time with CSS)

And, thanks for posting something! I’ve been climbing the walls , staring, waiting for someone to say something for TWO DAYS! … not a sausage, a peep, a squeak a nada!

… Cabin fever

---

<div class="post-metadata">

**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\
**Post date:** [December 9, 2018, 7:54pm UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/3 "2018-12-09T19:54:15Z")

</div>

Thanks for checking and the feedback, schpengle. While I’m learning this stuff, I’ll have MANY, MANY questions to ask that’ll keep you hopping, so stay tuned.

As for the spelling, it’s old English from our colonial days and is the name of the organization so I dare not correct their spelling or I’ll be put on a boat back to ol’ England, probably in chains. 🙄

And still wondering why those %$#\* scrollbars were showing on my iPhone earlier…

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [December 9, 2018, 9:25pm UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/4 "2018-12-09T21:25:09Z")

</div>

because your css sucked? 🙂Hee hee  
All done now mate. well done on the site.

---

<div class="post-metadata">

**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\
**Post date:** [December 10, 2018, 3:23am UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/5 "2018-12-10T03:23:51Z")

</div>

That’s the rub… I haven’t touched my old site or any of its ‘sucky’ CSS and yet the scrollbars have vanished. I wish it was something in the CSS that I knowingly changed so I can sleep tonight. I just checked another site that I published a year ago and its iframe also no longer displays any scrollbars on my iPhone… so I’m believing Apple did change their IOS to work better with iframes and scrollbars?

---

<div class="post-metadata">

**Author:** ![Thomas](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/thomas/32/61_2.png) [@Thomas](https://forum.pinegrow.com/u/Thomas)\
**Post date:** [December 10, 2018, 8:17am UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/6 "2018-12-10T08:17:57Z")

</div>

I might be wrong - indeed. But even on desktop Safari, you can set the behaviour of the scrollbars - so perhaps you can do this on cell-phones as well? Or you can even force your page showing them permanently? Wait - I’ll have a Google for this:

[http://simurai.com/blog/2011/07/26/webkit-scrollbar](http://simurai.com/blog/2011/07/26/webkit-scrollbar)

The point is, that iFrame and other “force-to-scroll” techniques (css spoken overflow: hidden) are not user-friendly. The required scrollbars are space consumers and it’s pretty hard to scroll in-page on touch anyway.

We had this discussion, as far as I remember, a while back. Certainly - without having scrollbars permanently, it’s not really obvious that there is hidden content - but that’s a designer’s decision - he’s the culprit. So many things are not necessarily a “technical decision”.

Cheers

Thomas

---

<div class="post-metadata">

**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\
**Post date:** [December 23, 2018, 5:32pm UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/7 "2018-12-23T17:32:28Z")

</div>

To keep you ‘off of the walls’… I have another question.

I’m trying to add a page to a website I’m building that will enable text to scroll over a background image (which I’ve done using Pinegrow’s background image tool - see: [http://statecollegedev.com/taliya](http://statecollegedev.com/taliya)). However, I now need to add @media code to get the background image to resize properly, depending on device size. I’ve found CSS code that succesfully changes the background color per device size, but I cannot get the images to load. I’ve created four images that have been re-sized per the device’s screen and am trying to have the CSS load them - which doesn’t work. (see [http://statecollegedev.com/taliyatest](http://statecollegedev.com/taliyatest)).

I’m attaching a screen shot of the CSS that does change the body color but does not load any of the background images. I have placed nothing in the HTML since I don’t know if that’s necessary or, if I DO need to add something, I don’t know what or where to add it.

 ![css%20capture](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/1/193100cb4886bbfa5d484542e563c969b85e5404.png)

I’ve also asked Printninja for help so hopefully between you two experts, I can get pointed in the right direction to get this to work.

---

<div class="post-metadata">

**Author:** ![schpengle](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/schpengle/32/238_2.png) [@schpengle](https://forum.pinegrow.com/u/schpengle)\
**Post date:** [December 24, 2018, 2:50am UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/8 "2018-12-24T02:50:48Z")

</div>

I’m not sure about _image-url_ there @randyrie

have you looked at this?

> **[background-image | CSS-Tricks](https://css-tricks.com/almanac/properties/b/background-image/)**
>
> The background-image property in CSS applies a graphic (e.g. PNG, SVG, JPG, GIF, WEBP) or gradient to the background of an element. There are two

particularly this

> **[background-image | CSS-Tricks](https://css-tricks.com/almanac/properties/b/background-image/#article-header-id-2)**
>
> The background-image property in CSS applies a graphic (e.g. PNG, SVG, JPG, GIF, WEBP) or gradient to the background of an element. There are two

with regards what you are trying to achieve above.

Providing your image path is actually correct that is… that is usually what I get wrong.

---

<div class="post-metadata">

**Author:** ![randyrie](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/randyrie/32/2103_2.png) [@randyrie](https://forum.pinegrow.com/u/randyrie)\
**Post date:** [December 24, 2018, 5:09am UTC](https://forum.pinegrow.com/t/really-nice-feature/2498/9 "2018-12-24T05:09:16Z")

</div>

I’ve changed the CSS to:

 ![29%20PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/5/58273d769c3311907c532c8e615dd82288513494.png)

But this doesn’t work either. See [http://statecollegedev.com/taliya](http://statecollegedev.com/taliya)

Any ideas what I’m doing wrong?

BTW, I found a good tip on the web that really helped to keep the image from enlarging and flying off center (works perfectly on my desktop but fails miserably on my iPhone which is why I want to swap out to a smaller image that will display properly on mobiles. See the code I inserted in the body tag:

 ![body%20tag](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/e/e6879f95a6a1e15e7772f0d801618ba099fdaf6a.png)
