-1

I have a website that is giving me a ton of trouble with the site not fitting the width of the screen. I tried changing the viewport meta tag but nothing seems to work properly. I have included a screenshot at the below link. You can see a huge margin on the right hand side on iPhone. Please any help is appreciated as I am stumped!

Link to screenshot

Mike Barbaro
  • 245
  • 1
  • 17

3 Answers3

1

You haven't posted any code for us to look at, but you should have a "wrapper" element that contains all the other content. That wrapper, if it were a div would stretch to 100% of the viewport width. Child elements in the wrapper would need to be responsive as well.

Scott Marcus
  • 64,069
  • 6
  • 49
  • 71
0

I got the URL from your screen shot. In the "Group Fitness" section you have an embedded image with width: 649px

<img style="width: 649px;" src="<massive data removed...>" data-filename="IMG_3105.JPG">

You should remove the style from that img tag, or set it to a %.

Ricci
  • 1
  • 1
0

Thanks to the prior answer, I looked into your live site source code. Following repeated &nbsp; s creating the error. 

<h2>
    <span style="font-weight: normal;">
        <span>INSANITY LIVE<br>
            <font color="#efefef" style="background-color: inherit;">Monday&nbsp;6:00pm</font>
        </span>
        <font color="#efefef" style="background-color: inherit;">   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <br>
      Wednesday 6:00am
        </font>
    </span>
</h2>

If those extra characters are dynamic, quick fix with @media would be 

font[style^=background] { display: inline-block;}
CreativeCreate
  • 196
  • 4