Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

How to get a web page resize layout with CSS to according to resolution ( i.e . mobile devices ) ?

Posted on 2012-03-19
9
Medium Priority
?
303 Views
Last Modified: 2012-06-21
Hello Experts.

I've seen somewhere on a Dreamweaver video of an upcoming feature a while back that can take your webpage and have it resize and change layout if it detects a mobile device or something with a different resolution.

I'd be very grateful for pointing to the right way.

Thanks in advance.
0
Comment
Question by:colonelblue
9 Comments
 
LVL 22

Accepted Solution

by:
Mrunal earned 1000 total points
ID: 37740935
0
 
LVL 30

Assisted Solution

by:IanTh
IanTh earned 1000 total points
ID: 37743183
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 30

Expert Comment

by:IanTh
ID: 37743216
see
http://tv.adobe.com/watch/cs-55-web-premium-feature-tour-/dreamweaver-cs-55-creating-a-native-mobile-application/

they bought phonegap of the devs and integrated it into dreamweaver so you can write a app using web design elements
0
 
LVL 16

Expert Comment

by:s8web
ID: 37746571
*Not for points, the first comment steers you in this direction.*

It's funny, we spent a long time waiting for displays to get bigger, and processing power to improve so we could make everything big and shiny, then bam, we're targeting small displays again.

Anyhow, you should take a few to look into 'responsive web design.' You use 'css media queries' to deliver different css content to various display sizes.

The media queries work natively in all good, modern browsers, and IE9. You 'll need to include a little conditional js to support <IE9.

http://thinkvitamin.com/design/beginners-guide-to-responsive-web-design/
http://designmodo.com/responsive-design-examples/

I noticed that Dreamweaver 5.5 understands this principal. That's probably what you heard about. I use DW as a code editor only. I've never been pleased with it's WYSWIG design stuff. It's best to set up a test environment instead of relying on DW's parser.
0
 
LVL 30

Expert Comment

by:IanTh
ID: 37746687
I have to tell you its not good to target ie9 m$ are going to silently update ie so in the future web code needs to be very strict to work with any ie version I have a feeling that using dreamweaver will work but I think its far better to use now and in the future html 5 as I think that will also help out the situation with ie
0
 
LVL 30

Expert Comment

by:IanTh
ID: 37746698
dreamweaver has integrated phonegap which was available before I useed it with eclips it to do it for mobile devices way before adobe purchased it
essentially an app is a web design its not really going to work as a local app that needs to be done in xcode to use nitro as thats the only way
0
 

Author Comment

by:colonelblue
ID: 37750878
Thank you SO VERY much. I have much to digest.
Cheers Experts!
0
 

Author Closing Comment

by:colonelblue
ID: 37750891
Thanks IanTh and mroonal.
IanTh , you just rock!
Also s8web, thank you for those great additional links. Greatly appreciated!

I wish you all great karma.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article was originally published on Monitis Blog, you can check it here . Today it’s fairly well known that high-performing websites and applications bring in more visitors, higher SEO, and ultimately more sales. By the same token, downtime…
Without even knowing it, most of us are using web applications on a daily basis.  In fact, Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We generally confuse these web applications to…
This tutorial demonstrates how to identify and create boundary or building outlines in Google Maps. In this example, I outline the boundaries of an enclosed skatepark within a community park.  Login to your Google Account, then  Google for "Google M…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Suggested Courses

877 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question