Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS TOP PADDING: Diffenrences in Safari/Chrome & Firefox/Opera

  • This topic is empty.
Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #32866
    tobias
    Member

    Hi all!

    I’m facing problems with the rendering of Top Padding – Differences:

    A normal

    Headline

    is rendered with different top-padding in Safari/Chrome than in Firefox/Opera.

    I did a CSS-reset: * { margin: 0; padding: 0; }

    Click on the links for the screenshots (hope it works).

    In my opinion Safari and Chrome are rendering it correctly.

    Someone an idea?!

    Thanks,
    Tobias

    #75447
    TheDoc
    Member

    Could just be how the font is being rendered by different engines.

    Do you have a link to the site?

    #75400
    grovesk
    Member

    Can we see the CSS you have for the H1?

    It might be the line-height for the H1? I’ve found this to be the key when fixing this kind of problem, (although I’m usually focused on differences between Chrome/FF and IE).

    For example, in my global style sheet, I’d have:


    h1 {
    font-size: 20px;
    line-height: 3px;
    }

    And in my IE-only style sheet, I’d have this:


    h1 {
    font-size: 20px;
    line-height: normal;
    }
    #75312
    tobias
    Member

    Thanx TheDoc. It was the font. After choosing another one Firefox behaves similar as Chrome and Safari.

    Strange, but good to know. The effect screwed up my whole design…

    #75314
    TheDoc
    Member

    Unfortunately just a problem we have to deal with these days.

    I no longer strive for pixel perfection across all browsers – there are going to be minor differences between them no matter how hard you try, just have to accept that fact! The sooner you do, the easier it becomes.

    #75261

    Have you declared the universal selector * to margin:0 and padding:0 ?

    #75255
    Qbit
    Member

    Yes he did. Take a look at the first post.


    @TheDoc
    :
    Unfortunately pixel perfection is something that a lot of customers still demand. I know, that we have the responsebility to teach them why this is a bad idea. But we still have to deal with pixel perfection.

    #75250
    TheDoc
    Member

    @Qbit – I would expect any client to demand perfection, if they don’t their business surely won’t last very long!

    I have very specific deliverables in my contract that say pixel perfection will not be achieved across all browsers. Browser rendering of font, for example, is completely out of every single developers control. Do I strive to be as close as possible? For sure! I want to be proud of my work. But if I’m going to use progressive techniques (say, CSS3), I simply explain to the client that it might not look the exact same in earlier versions of IE.

    In my experience, as long as I explain the technical limitations of aged browsers, clients seem to be willing to agree.

    #75204
    mshort1985
    Member

    all of my clients so far have been pretty understanding in this regard, I just explain to them that certain things (like font) are out of my control, and that if using CSS3 it may not render exactly the same in earlier browsers. But yes I do strive to get things to work as close as possible.

    #75200
    Qbit
    Member

    Lucky you! I often work in and for bigger comanies, which makes it harder for me. But I don’t wanted to start a religious fight, the internet is full of that. ;)

    #75168
    TheDoc
    Member

    @Qbit – I don’t really think it’s about luck. What I described above was my freelancing, the company that I work for full time deals with a lot of municipalities and they are much harder to convince. It’s definitely harder when dealing with larger businesses/corporations, but I think in the end if they know they’ll be getting a better product, it all comes into place in their mind.

Viewing 11 posts - 1 through 11 (of 11 total)
  • The forum ‘CSS’ is closed to new topics and replies.