Skip to main content

Bug Tracker

Side navigation

#13549 closed bug (notabug)

Opened March 02, 2013 12:26AM UTC

Closed March 13, 2013 12:46AM UTC

width() does not read and write using the same box model

Reported by: kwooda@gmail.com Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: 1.5.2
Keywords: Cc:
Blocked by: Blocking:
Description

Using width() to obtain the width of an element appears to return the dimensions of the content box, whereas writing width appears to apply to whatever box model the browser uses to render the element.

Try creating an absolutely-positioned div on the screen with a 1px border and padding, using the border-box box-sizing, 100px wide by 100px high. Do $(myDiv).width() on the div to get the dimensions. It will return 96, not 100, as it seems to subtract the padding and border thickness. If you then write $(myDiv).width(96), the box will shrink in width, because this width is applied to the border box, not the content box.

I should be able to read width() and write the same value right back to width() without any notable change. Width should act upon whatever box model is used to render the element. If border-box is applied, width() and width(w) should apply to the border box. Similarly with content-box (and ideally also with margin-box and padding-box, if supported).

Attachments (0)
Change History (3)

Changed March 02, 2013 12:31AM UTC by anonymous comment:1

I just realized I am using an old version of jQuery - 1.5.1 - so perhaps this issue has already been fixed. We aren't able to upgrade just yet.

Changed March 02, 2013 11:14AM UTC by m_gol comment:2

Works fine for me:

http://jsfiddle.net/m_gol/h6tcV/

AFAIK proper support for box-sizing: border-box was added in jQuery 1.8.

Changed March 13, 2013 12:46AM UTC by timmywil comment:3

resolution: → notabug
status: newclosed
version: git1.5.2