I’m trying to position four elements at the four corners of a parent element. The parent element has a border whose size changes dynamically. I’d like to position the elements such that they touch the outer edge of the border, and preferably do it in such a way that I don’t have to worry about doing something when the border changes size.
Using absolute positioning, I’m able to get them positioned relative to the inside the border: http://jsfiddle.net/V5jFx/1/
I can’t figure out how to do it relative to the outside, however.
It’s not mandatory that the four corner elements be children of the parent, and I’m willing to use javascript, although again I would really prefer not have to detect changes to the size of the border.
http://jsfiddle.net/wyKG2/1/
Create a wrapper whose inside border matches the outside border of the border div. Now you can do whatever you want width wise, and this will work.