0

Note: Google Drive no longer provides hosting. Thereby the information below (as well as any answer) is virtually irrelevant.

Bootstrap is not being applied on Safari Mobile.
I'm using Google Drive for hosting.

Website I'm working on: https://drpinson5.blogspot.com/

Screenshots:

Safari (not responsive):

Safari (not responsive)

Chrome (responsive):

Chrome (responsive)

  • Should be dupe of: https://stackoverflow.com/questions/40478447/google-drive-hosted-css-not-working/40478448#40478448 –  Nov 16 '16 at 00:10

2 Answers2

0

Forget about bootstrap img-responsive, try to use pure css code and embed it to the image html tag. And use Viewport-percentage lengths: the vw, vh, vmin, vmax units. Vw (for width) and vh (for height) for sizing the image.

Here's the example code :

<img src="/images/xxx.jpg" style="width:100vh; height:150vh"/>

for more reference :
https://www.w3.org/TR/2015/CR-css-values-3-20150611/#viewport-relative-lengths

hope this answer could fix your problem.

0

I found out there is no privilege access for non google login user. So make your CSS and JS files as public

You need to give the access to all these files, and also need to check with other browsers that are not logged in with google account.

<link href='https://googledrive.com/host/0B3X3aqxEWs4QZGtzMS16YVJrdkE' rel='stylesheet' type='text/css'/>
<link href='https://googledrive.com/host/0B3X3aqxEWs4Qa3JiSWt1Z1JNNlU' rel='stylesheet' type='text/css'/>
<script src='https://googledrive.com/host/0B3X3aqxEWs4QTFJ0ejUxZ0t0dFU' type='text/javascript'></script>
<script src='https://googledrive.com/host/0B3X3aqxEWs4QeVNqdjBYRkRMclU' type='text/javascript'></script>

enter image description here

Nehemiah
  • 1,063
  • 7
  • 15