CODEWITHSUNDEEP
iphoneresponsive-design
Rev. Samuel
Rev. Samuel

Reputation: 118

Responsive design doesn't display correctly on iphone

This is my first responsive site. It was originally a regular site but the client now wants it to fit on iphones, ipads, etc.

I created all of the media queries and checked them using FF web dev toolbar's View Responsive Layouts. Everything looks good so I uploaded it to a test server and it just shows the regular site view very small.

There must be something small I'm missing but I can't figure it out.

http://lovetro.com/dwi-rochester/

Upvotes: 0

Views: 387

Answers (2)

ceejayoz
ceejayoz

Reputation: 179994

You're missing the viewport <meta> tag, which tells the iPhone what size it should display the page at. Thus, it think it's gotten a desktop site at roughly 960px and displays it as such.

Add to your <head>:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Upvotes: 3

drip
drip

Reputation: 12943

Add this in your head:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

Upvotes: 2

Related Questions