Skip navigation

Dreamweaver

CeliaThaxter Calculating status...

Currently Being Moderated

Need help with website appearance on ipad

Feb 4, 2013 4:46 PM

My website is finally looking ok on all the various pc browsers and I figured out a workaround so that the menubar works properly on the Ipad. The only thing I'm unhappy with is that the page title is crunched up at the top of the page on the ipad. It's supposed to be centered and that's how it looks everywhere else. How do I fix the problem? Website is nhcstar.org

285 Views 3 Replies Latest reply: Nancy O., Feb 5, 2013 10:14 AM

Replies

Currently Being Moderated

1. Ben Pleysier,

Feb 4, 2013 6:59 PM in reply to CeliaThaxter

Report

Have a look at http://rivercardpoker.com.au/

This site was constructed in 3days using the http://foundation.zurb.com/ framework.

|
Mark as:
Currently Being Moderated

2. Lon Winters,

Feb 4, 2013 11:50 PM in reply to CeliaThaxter

Report

Herer's a couple of things I've encountered while getting pages to display the way I want on the iPad. Please bear in mind that I've only tested on iPad 1, so I'm not sure if they still apply for the 2 or 3. They are also just a couple of observations which may or may not apply to your specific issue.

First, I've notcied that the iPad will squeeze the page down to the outer-most div container if the width is larger than the screen resolution.

Second, this may be more relevant to you - when you refer to the title, are you talking about the image that says "NHC 2013"? If so, how are you positioning it. If you're using a margin, I've seen where the iPad seems to ignore top margins. My work-around was to create the image or whatever content to fill the entire space, and not depend on the margin or perhaps other positioning attributes that work everywhere else.

I've also seen 1px gaps between adjacent divs on the iPad. For example, there's a container with a grey background - contain two divs, one above the other both with white backgrounds. Every browser, there is no gap or break, but there is on the iPad!

|
Mark as:
Currently Being Moderated

3. Nancy O.,

Feb 5, 2013 10:14 AM in reply to CeliaThaxter

Report

If you have CS6, you could use Fluid Grid Layouts to create a responsive layout for mobiles, tablets and desktops.

Live Example:
http://alt-web.com/FluidGrid/Fluid.html

CS6 Fluid Grid Layouts (6 min video)
http://tv.adobe.com/watch/digital-design-cs6/creating-adaptive-designs -using-fluid-grid-layouts-in-dreamweaver-cs6/

CS6 Fluid Grid layouts (17 min video)
http://tv.adobe.com/watch/learn-dreamweaver-cs6/using-fluid-grid-layou ts/

Step-by-Step tutorial -- Building Fluid Grid Layouts in DW CS6
http://www.adobe.com/inspire/2012/08/fluid-grid-layouts-dreamweaver-cs 6.html

Nancy O.

|
Mark as:

Forum guidelines

Answers + Points = Status

10 points awarded for Correct Answers
5 points awarded for Helpful Answers
10,000+ points
1,001-10,000 points
501-1,000 points
5-500 points

Dreamweaver

Need help with website appearance on ipad

Feb 4, 2013 4:46 PM

More Like This

Bookmarked By (0)

Answers + Points = Status