Responsive Websites

SpaceshipSpaceship
NamecheapNamecheap
Namecheap AuctionsNamecheap Auctions
Watch

DnEbook

DataGlasses.ComTop Member
Impact
5,747
I have been wondering a bit about making a site to be responsive and i have come across the
<meta name="viewport" content="width=device-width, scale=initial-1">
Although i did the examples below as an alternative to the above (used together as shown)

<meta name="viewport" content="width=device-width"
<meta name=“viewport” content=“initial-scale=1”>
~
I am reading people get different results with this meta tag depending on what device they are using at the time. So what is the best solution ??

Also i am seeing different variations of the .css declaration blocks

@viewport{
zoom: 1.0;
width: device-width;

@viewport{
zoom: 1.0;
width: extend-to-zoom;
}

@-ms-viewport{
width: extend-to-zoom;
zoom: 1.0;
}

I was wondering what do you guys use as a 'standard' ? My crappy little phone does not really get used for mobile browsing but i would like to know what is considered best practice so i can apply it to any of my sites
~
Thanks in advance!
 
0
Close
The views expressed on this page by users and staff are their own, not those of NamePros.
GoDaddyGoDaddy
You also have to make sure elements of the website can move around when viewing in different devices and resolutions, therefore making it 'responsive'. The above you posted is only part of it.

There are a few different methods but this is the one I like to use:

http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

Depending on how your site is set up, you may just need to apply responsive elements to a few main wrappers to get this to work.
 
1
Close
Thanks Tia !
 
0
Close
I am quite surprised how close this is without any wrapping adjustments eSearch Lawyer
 
0
Close
Thank you in Advance !
 
0
Close
0
Close
CatchedCatched

We're social

Escrow.com
Spaceship
Domain Recover
CryptoExchange.com

NamePros updates

Switch between accounts
You can now stay logged in to more than one NamePros account in the same browser. Click your avatar, then "Accounts in this browser", to...
AIVikings
Catchy
  • The sidebar remains visible by scrolling at a speed relative to the page’s height.
Back