2 Replies Latest reply on May 11, 2010 9:46 PM by Stephen Cox

    Safari Trouble

    aubrierobinson@aol.com

      Hi,

       

      I am fairly new to the website design world. I just created a website for a college class . I got the site to look great in Internet Explorer and FireFox but for some reason I am having a problem with Safari.

       

      I am a mac user so I really want my site to run good in Safari. The problem lies with the navigation menu. As I said it looks good in other browsers but in Safari it appears to be longer than the rest of my page. I have tried to change everything I can thing of to get it to fit within the page. I tried specifying the #nav width, I tried changing it to auto. Before I added the scroll over drop down menu, it was fine. Any suggestions as to what might be wrong?

       

      Side note: When I magnify the page in safari I can eventually get the navigation to fit within the page...

       

      Take a look. http://www.calihanchiropractic.com/

       

      I am using CS3 & CS4. Does anyone have any suggestions as to how to get this to fit within my page?

       

      Thanks!

       

      Aubrie

        • 1. Re: Safari Trouble
          Ben M Adobe Community Professional

          I'm sorry to be blunt, but it doesn't look good in Firefox.  In Safari your menu is being stretched, but in Firefox the Make An Appointment option is being wrapped down.

           

          You have 3 validation errors in your code.  Line 67, 97 and 108, the align attribute does not exist for those elements.

           

          You also have invalid CSS code at the beginning of that document with style2, style6 and style8.  All CSS declarations need to have attribute:value; .  In your case the values are not valid.  12 is not a valid font-size.  When you declare font-sizes you need to have a unit of measure following them whether it is pt, px, em, etc.  Same thing goes for a:hover on your other CSS document.  A color needs to start with a "#" in front, otherwise the browsers will ignore the color.

           

          To fix your div issue I would probably say to remove the outer margin.  You already have padding within the cells, so it was like having double padding on the sides.  Otherwise you will need to reduce the font-size for that area to make it work, unless you create a fixed or percentage-based width for the menu options thus forcing text to wrap within those containers.

          • 2. Re: Safari Trouble
            Stephen Cox Level 1

            Since you on Mac, check out the Safari development site at Apple: https://developer.apple.com/safari/

             

            You might have to create a developer account (the basic level one is free). Tons of excellent info on Safari there. You can do much with that browser.

             

            Firefox's dev center is at https://developer.mozilla.org/En  Another excellent resource for another great brower.

             

            IE , well IE's a mess. But I suppose we all must deal with it.. so... http://msdn.microsoft.com/en-us/ie/default.aspx

             

            Just some "light" reading.