Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Oct 2003
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Determine width of absolute positioned DIV

    I'm trying to determine the width of a DIV tag positioned with the following CSS style attributes: position: absolute; top: 20px; left: 0px; float: left;

    I'm purposefully not specifying the width of the DIV as I want it to auto-expand and auto-shrink to the content that is contained in it. I need a way to determine the actual rendered width of the DIV at some point in time that works reliably for both IE 5.5 and above and NS 6.2 and above.

    All suggestions would be greatly welcomed as my initial attempts to dtermine this have not been successful to date.

    Thanks!

  • #2
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    From CSS2 specs:
    9.5.1 Positioning the float: the 'float' property

    'float'
    Value: left | right | none | inherit
    Initial: none
    Applies to: all but positioned elements and generated content
    Inherited: no
    Percentages: N/A
    Media: visual
    In other words, you can't use float and position at the same time. One or the other. According to the specs, a float needs to have it's width set explicitly. A width of auto will be computed to 0, so you need to set a fix width.
    10.3.5 Floating, non-replaced elements

    If 'left', 'right', 'width', 'margin-left', or 'margin-right' are specified as 'auto', their computed value is '0'.
    width: auto; works for what you want to achieve in all cases in all browsers but op7 (in which it still works in some cases) as far as I know, however.

    Well, that was all about floats...


    As for getting the actual width, do you mean from a script? If so, try to use elm.offsetWidth.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #3
    New Coder
    Join Date
    Oct 2003
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the reply.

    I think I can probably remove the float tag and use the auto width as you suggested.

    As far as the width goes... I need to determine the actually display/rendered width if the div tag from a script. I'll use the width to re-position the div based on other user action (click on a link, etc.) to another area on the screen - the width and height are required to calculate the new position.

    Does this help you to provide any additonal information?

    Thanks again!!

  • #4
    New Coder
    Join Date
    Oct 2003
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Is there a NS element counterpart for the IE offsetWidth?

    Thanks,

    Todd

  • #5
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    try document.defaultView.getComputedStyle(elm).width.
    (Not sure the syntax is correct, but try it.)
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards


  •  

    Posting Permissions

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