Results 1 to 2 of 2
  1. #1
    stevenjohn
    Guest
    CSS strangeness in Safari only!?
    Hi there,

    I have been developing a liquid css layout webpage that can be viewed at:

    http://www.oneworldmarket.org/demo-corporate/

    After lots of pain, and a lot of CSS hacking it now looks good in IE's, Opera, and the Mozilla family... but not Safari. For some reason Safari bunches up the main content into the left hand side.

    The css has been validated by w3 as has the XHTML.

    I dont want to list endless css at you, but some of the more pertinent stuff is:

    div#maincontent
    {
    display: table;
    height: 1%;
    margin: 0em 10em 2em 1.5em;
    clear: left;
    }

    #index {
    float:left;
    width: 95%;
    }

    div#index div.indeximage
    {
    float:left;
    width: 100%;
    height: 182px;
    margin-top: 3px;
    border: 1px solid #FFFFFF;
    background-image: url(../../../var/corporate/storage/packages/corporate_blue/files/default/file/design/corporate/images/navbar/home-image.jpg);
    }

    #index2 {
    float:left;
    width: 100%;
    margin-top: 20px;
    }

    div#index2 div.indextitle
    {
    float:left;
    border: 0px solid #FFFFFF;
    width: 23.5%;
    }

    div#index2 div.indextitleinner
    {
    float:none;
    color: #006699;
    width: 100%;
    font-weight: bold;
    font-size: 75%;
    padding: 3%;
    margin-top: 5px;
    border: 1px solid #FFFFFF;
    background-color: #66ccff;
    }

    div#index2 div.indexintro
    {
    float:left;
    border: 0px solid #FFFFFF;
    width: 32%;
    margin-left: 3%;
    }

    div#index2 div.indexintroinner
    {
    float:none;
    width: 100%;
    padding: 3%;
    margin-top: 5px;
    border: 1px solid #FFFFFF;
    background-color: #66ccff;
    }

    div#index2 div.indexbody
    {
    float:right;
    border: 0px solid #FFFFFF;
    width: 32%;
    margin-left: 2.5%;
    }

    div#index2 div.indexbodyinner
    {
    float:none;
    width: 100%;
    padding: 3%;
    margin-top: 5px;
    border: 1px solid #FFFFFF;
    background-color: #66ccff;
    }

    div#index2 div.indexboxtitle
    {
    float:none;
    color: #66ccff;
    font-weight: bold;
    font-size: 65%;
    padding-left: 3%;
    padding-right: 3%;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    border: 1px solid #FFFFFF;
    width: 100%;
    background-color: #006699;

    }

    which controls the main content area.

    Any ideas as to why Safari alone is falling over would be greatly appreciated (admitedly I havent looked at IE5/MAC)

    Anyway, many thanks. Steve.

  2. #2
    RobDreugan
    Guest
    I don't see the bunching up of text in safari that yer talking about.


    The general rule of thumb is that if it looks good in Mozilla all other browsers should fall in line. Positioning can get irritating b/c mozilla / ie can be slightly off, or very very off, depending on how you positioned things.

    Like I said I don't see anything wrong right now with the problem u said u were having with safari, but best thing to do when positioning is messing up, I'd comment each section out, and start from scratch, by just rebuilding each class. Sometimes the 2nd time around you realize something stupid you did, or a better way to position it.

Thread Information

Users Browsing this Thread

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

Similar Threads

  1. Safari wont refresh css
    By Devbizz in forum Web Design and Hosting
    Replies: 3
    Last Post: 11-07-2011, 06:05 AM
  2. CSS in Firefox and Safari
    By FinnIII in forum Web Design and Hosting
    Replies: 2
    Last Post: 04-10-2008, 08:39 AM
  3. problems with CSS and Safari
    By paldo in forum Web Design and Hosting
    Replies: 0
    Last Post: 10-30-2007, 04:58 PM
  4. Test of a simple CSS menu in IE5/Mac and Safari
    By s_ivan10 in forum Web Design and Hosting
    Replies: 4
    Last Post: 10-02-2004, 03:13 AM
  5. Safari: CSS class not applied to form text boxes
    By schoolyard in forum Web Design and Hosting
    Replies: 1
    Last Post: 04-05-2004, 04:17 PM

Posting Permissions

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