I have been trying to get my new site template to adapt to mobile devices. So far it works when I resize the browser window. Problem is it doesn't work on mobile devices. It displays as a regular web page.
I'm not sure if you are using media queries to specify css rules for your different devices/screen sizes, but for an iphone for you would need to use this media query, and put your iphone/phone css rules inside this query
/* iPhone 4 ----------- */ @media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) { /* Styles */
OpelM, you can test using iOS and many Android browsers at BrowserStack.com. Give them your email and you get something like 60 minutes of free testing and then you have to subscribe, but it should help you at least get started.
@opeim juuust a quick suggestion, your header image is a little small width wise....users with a res width higher than 1024 (which is ALOT of people!) are going to see it looking a little weird...
Just a little nit picking, site looks nice other wise!
Hey guys is it possible to get screen caps of what my site looks like on your mobile phones. Unfortunately I don't have a smart phone and can't test out the site. I've tried various mobile phone emulators and they show different results.
Take a look at my company’s new responsive design website www.dronamobile.com, you would be able to push and pull the browser window to test the "responsiveness" of this website. When I reduce the width of the browser, everything just flows "under" the browser frame and is cut off, just like the web content. Do explore and share your feedback about it...
Hi
i did responsive web design for my office website but it showing me white space
for right side and it working in when i re size browser . but it not working samsung note 2
I have been trying to get my new site template to adapt to mobile devices. So far it works when I resize the browser window. Problem is it doesn't work on mobile devices. It displays as a regular web page.
Here is the web page: http://opelm.com/test/
If anyone can offer me a solution, and even suggestions as to what I must add to my site in terms of CSS that would be helpful.
I'm new to this whole responsive design thing.
Thanks!
/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}
Ryan
-webkit-text-size-adjust: none;to the @media for mobile phones.@Caleb: I found a site which emulates mobile devices. Let me know what you think about it: http://www.mobilephoneemulator.com/
Just a little nit picking, site looks nice other wise!
http://www.opelm.com/wptest/
https://lh6.googleusercontent.com/-QBMlMbNcnnQ/T9VSCaajNII/AAAAAAAADqM/T9rgZTL9UyY/s800/OpelM%20-%201.jpg
https://lh5.googleusercontent.com/-sFy-fTpL6qQ/T9VSCI8nduI/AAAAAAAADp4/q8yMg7zHfUA/s800/OpelM%20%20-%202.jpg
https://lh5.googleusercontent.com/-O31xaODaMQY/T9VSCFIfkjI/AAAAAAAADp8/qLKExrvuKzA/s800/OpelM%20%20-%203.jpg
https://lh4.googleusercontent.com/-mZ3hValMkL4/T9VSCFbuNxI/AAAAAAAADqA/_36FDOrb3g4/s800/OpelM%20%20-%204.jpg
Take a look at my company’s new responsive design website www.dronamobile.com, you would be able to push and pull the browser window to test the "responsiveness" of this website. When I reduce the width of the browser, everything just flows "under" the browser frame and is cut off, just like the web content. Do explore and share your feedback about it...
TeamDeltecs
Hi i did responsive web design for my office website but it showing me white space for right side and it working in when i re size browser . but it not working samsung note 2
@shivu Please start a new topic for your problem
It would also be helpful if you would provide a link.