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
290 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
9 Comments
 
LVL 22

Accepted Solution

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

Assisted Solution

by:IanTh
IanTh earned 250 total points
ID: 37743183
0
Get 15 Days FREE Full-Featured Trial

Benefit from a mission critical IT monitoring with Monitis Premium or get it FREE for your entry level monitoring needs.
-Over 200,000 users
-More than 300,000 websites monitored
-Used in 197 countries
-Recommended by 98% of users

 
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

Is Your Team Achieving Their Full Potential?

74% of employees feel they are not achieving their full potential. With Linux Academy, not only will you strengthen your team's core competencies but also their knowledge of of the newest IT topics.

With new material every week, we'll make sure that you stay ahead of the game.

Question has a verified solution.

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

Because your company can’t afford for you to make SEO mistakes, you’ll want to ensure you’re taking the right steps each and every time you post a new piece of content. This list of optimization do’s and don’ts can help you become an SEO wizard.
Does your audience prefer people in photos or no people? How can you best highlight what you’re selling? What are your competitors doing, and what can you do that is different and unique from them?  Continue reading to learn how to make your images …
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

729 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