Auto-Width + 20px?

I was wondering if you could some how take the width of an element when it is set with CSS to width: auto; and some how add 20px to that width and set that as the width of the element? Or if there is some other way to do this while still accomplishing the same thing?

 

You are unclear. Do you want that there is at least 20px-worth of width inside at all times?

Or do you want the element 100% wide (which is the default for static blocks whose widths are set to "auto") PLUS 20px more?
The rest of this post assumes the latter.

Once you make a static element even wider, it'll pull its container wider, instead of sticking out. So that's no go.

If you make the element absolutely positioned, it comes out of the flow and you want it to "see" the width of its parent so that it knows it's 100% wide...

so I'd do this I think

make the element position: relative; width: 100%; padding: 0 10px; left: -10px;

that might work. relative positioning creates a whole new box (called the "generated box" in the specs) which sits exactly on top of the original box and takes all of the original box's visual attributes (children, borders, background colours, etc). But the original box is still in the flow, taking up space.
Setting the box to 100% means when you add padding to it (we added 10px on each side, so 20px in total) it gets added to 100%... if you leave the box "auto" then added padding only reduces the amount of content area inside. Then if you wanted it centered as well, I pulled it back to the left by 10px...

None of this is tested, just something that sounds right.

 

detect the with of browser and than calculate width for your desired width for auto. then you can add 20px in that width.

 

Let me know if this works:

body
{margin: 20px}

#autowidthdiv
{width: auto}

 

#youDiv { padding: 0px 0px 0px 20px; width:auto; }

Code (markup):

or

#youDiv { padding-left:20px; width:auto; }

Code (markup):

this code will set padding from left to 20px which will increase the div width +20px

 

@yho_o -- no, no it won't. Auto is the default state. That will just pad in the content.

Though I really think the OP's post is unclear.... I was thinking they were asking for something like "margin-right:-20px;" to make it 20px wider than the auto-width.

Notice that's MINUS 20px -- dragging the width wider than it's container.

 

i added auto, cuz you i do not know the width he is asking for, so he can place his own width + 20 pixels padding i think will does the job