HTML input element wider than Containing Div

Question

I have an html element that is contained within a div. Height are dictated by the outer div and the height and width of the input control are 100%. At the most basic level,

Answer 1

I'm assuming that you want the contained element () to be smaller than, or contained entirely within, the

?

You can either:

input {width: 50%; /* or whatever */ }

An html-element's width is calculated (I think) as the defined width + borders + margin + padding

If you've already defined the input as having 100% width of the parent, and then the other attributes are added it will definitely overflow the parent div.

You can set the margin/padding/borders to 0, but that would likely not look good. So it's easier, though not necessarily perfect, just to use a suitably-smaller width.

You could, of course, use

#parent_div {overflow: hidden; /* or 'auto' or whatever */}

to hide the portion of the input element that would normally overflow the container div.

0 讨论(0)

查看其它7个回答

发布评论:

提交评论

---

•  加载中...