iPad view of a SharePoint 2007 teamsite

Posted on 2012-09-19
Last Modified: 2012-09-26
Hi experts!

Have an iPad issue that in the image error.jpg below, the navigation.. when i mouse over the credit card promotions, the menu displays on the "further right side" - mis-alignment.

This is not an issue on the PC web browser.

I have attached the javascript code and CSS below.

Please let me know what do i need to change to ensure it works on the iPad as well, without affecting the PC internet explorer browser

Thanks so much for your help.
Question by:johncheng78
    LVL 53

    Expert Comment

    You have all the dimensioning hard coded in pixels which pretty much guarantees it will not support consistent rendering cross-platform.  So the options are:

    Use a separate stylesheet for ipad
    Re-calculate your widths to find the optimum values
    Use percentages instead of pixels
    Modify the design to meet standards

    The code looks like it was generated by something from the last century. Scrap it and either learn to do the coding yourself, or get a modern tool.


    Author Comment

    I do need a fix or advise on which code to change.

    The above answer is too generic
    LVL 53

    Expert Comment

    The above answer is too generic == I don't know how to code.

    Time you learned if you are going to do web development.  The only way to give more detail would to write the code for you, and that is not what we are here for.

    You have asked 34 question and 24 are still open.  That indicates that either you have unreasonable expectations or you lack respect for the volunteers on the site.  Either way you are going to find it difficult to get many responses.  This question sat for 9 hours without any kind of response and then it was six days before you acknowledged the post; during which time you posted 6 more questions.  

    You are rapidly wearing out your welcome.  I suggest you start working out your issues instead of expecting us to do your work for you.

    LVL 32

    Accepted Solution

    Sometimes there are question where there is no answer that fits into the realm of EE.

    The advice you need here is not "change this line to that" but you need someone to build a site that is cross browser compatible and works on mobile platforms. From what I can see you are quite a distance from this and I agree with Cd& that you need to scrap your code as it is quicker to do it properly than to use something that will always be a compromise.

    Your question also does not stop here, what about other mobile platforms?

    You need to built a robust solution in HTML5 and you need to have someone build this for you. And it must be evident that you will have to hire someone to do this for you. Or take lessons and learn coding and design...

    This is beyond free advice. Respectfully, think of it like a painter and decorator wanting to paint the Mona Lisa. A paint brush alone is not enough.

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Course: HTML5 Specialist

    HTML5 development skills are critical to all developers. HTML5 is the foundation to almost any development process. That's why business, design studios, development shops and other organizations need HTML5 developers. Get your foot in the door as a HTML5 specialist.

    CSS3 Custom checkboxes This article shows how to style the checkbox form element using only CSS. Works in: Chrome, FF, Safari, Opera, IE9+ Uses modernizr.js to check for :checked pseudo class, falling back to plain old checkboxes (IE8 and bel…
    CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
    In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
    In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at Browse or search based on font properties or name to find a suitable font for…

    779 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

    Need Help in Real-Time?

    Connect with top rated Experts

    15 Experts available now in Live!

    Get 1:1 Help Now