www.webdeveloper.com
Results 1 to 9 of 9

Thread: CSS - handheld devices

  1. #1
    Join Date
    Oct 2012
    Posts
    12

    CSS - handheld devices

    Hi,
    I was wondering if anyone could give me an answer on how to make a stylesheet(s) for handheld devices that gives you cross browser, cross device, cross platform? How do you get your layout to work with the atleast common ones?
    thanks in advance.

  2. #2
    Join Date
    Mar 2011
    Posts
    1,137
    There's no single answer for this. You can use @media queries to modify your CSS rules based on the device width and other "responsive design" principles that use ems and percentages instead of pixels for measurements, but not all pages or layouts adapt easily to those methods without significant changes. You have some learning to do, but in the end it's all choices you make as a designer.
    Rick Trethewey
    Rainbo Design

  3. #3
    Join Date
    Oct 2012
    Posts
    12
    Thanks for the reply. I was just wondering is there a set of screen resolutions that you should make different stylesheets for? For example: 960px width, then for a cellphone 460px or something. Is there like set of common width that you need to design for so you can cover the most common devices? Sorry if this isn't very clear I just really to figure this out for my school project.

  4. #4
    Join Date
    Mar 2011
    Posts
    1,137
    It's been a while since I researched this, but I believe the nominal width of the iPhone is 320px, and I use that for my media queries for this. From there, I rely on percentages to allow for other screen widths so I don't need to focus on particular dimensions. Again, not all designs lend themselves to this approach. It's just one aspect of dealing with the issue. Good luck!
    Rick Trethewey
    Rainbo Design

  5. #5
    Join Date
    Nov 2012
    Posts
    32
    rtretheway you are absolutely right and dave251 google your issue. you will definitely find the answer.

  6. #6
    Join Date
    Nov 2012
    Posts
    32
    for mobile site, you will need to get your hands dirty with html5/css3.

  7. #7
    Join Date
    Aug 2006
    Posts
    1,904
    There is a Web Developer add-on to firefox, that I use to view my sites. It will render a page with multiple views, as:
    Mobile Portrait (320x480)
    Mobile Landscape (480x320)
    Small Tablet Portrait (600x800)
    Small Tablet Landscape (800x600)
    Tablet Portrait (768x1024)
    Tablet Landscape (1024x768)

    I don't know about the accuracy, but those are the boundaries I use for media queries.

    Dave

  8. #8
    Join Date
    Sep 2006
    Location
    new york
    Posts
    266
    There were some great reference links given on this site's Mobile Web Development forum.

  9. #9
    Join Date
    Aug 2012
    Location
    1453 Gingerwood ave, Milpitas CA 95035,
    Posts
    37
    Here is a link which will help you in designing stylesheet for mobile.

    speckyboy.com/2010/10/07/designing-a-mobile-stylesheet-for-your-website/

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles