Forums

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

Home Forums CSS Firefox absolute position rendering issue compared to Chrome

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #36234
    lpeabody
    Member

    I have an element on my page that is absolutely positioned, and a parent element that is relatively positioned. My understanding of CSS is that the absolutely positioned element is absolutely positioned relative to the first ancestor element that has positioning (in this case the parent element which is positioned relatively). I’ve seen Chris do this numerous times. Am I correct in assuming this?

    This works correctly in Chrome, but in Firefox it literally expands my element to the size of the entire page.

    The elements, by the way, are an anchor tag and a table cell, which are positioned absolutely and relatively, respectively. So I have left, right, top, down set to 0 on the anchor tag so it expands to take up the entire size of the table cell.

    I believe this flies in the face of the CSS standard (even 2.1), and I noticed this issue began creeping up in Firefox 2 major revisions ago, so in Firefox 8. Kind of disappointed with Firefox right now.

    #95099
    vindicateme
    Participant

    i’d need to see an example of what you’re doing, because i do it all the time and it works in all browsers..

    #95100
    lpeabody
    Member

    Hi vindicateme. I believe this might be my problem http://www.webmasterworld.com/forum83/6391.htm

    I guess Firefox just outright ignores relative positioning if assigned to any table cell element, which would definitely explain the problem I’m having. As the bottom of that thread concludes, relative positioning of a table cell element is undefined by the W3C, so Firefox isn’t breaking the rules.

    #95102
    lpeabody
    Member

    Basically I have the following:



    I need that anchor element’s size to expand to the width and height of its parent table cell. I guess the question becomes now, how do I do this so that it’s cross-browser compatible?

    #95106
    vindicateme
    Participant

    you could make the anchor display: block, but that would only work if all the table cells were of the same fixed height.


    td {height:200px;}
    td a {display: block; height: 100%; width: 100%;}
    #131128
    ampo
    Participant

    Thanks vindicateme.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.