I have a DIV that contains all my form items, however all rows in my form are not uniform as some have links to datepickers, etc... after the textbox, select menu, etc... 开发者_开发百科anyway if I set the main container width to a set amount (450px) items wrap (IE only). So I tried setting the width to min-with and now in Chrome and IE my container DIV stretches the whole width of the page.
here's my css...
#form_container{min-width:450px;background:#e0c0c0;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius:10px;padding:10px;}
Anyone know how I can overcome this?
Thanks
You could put a container around your form with the maximum width that you want to allow your elements to go, and then give it either overflow: auto
if you want the elements to wrap if they are too long, overflow: hidden
if you want the elements to disappear if they are too long, or overflow: scroll
if you want there to be a horizontal scrollbar added if they are too long.
Try this:
#form_container
{
display: table-cell;
min-width:450px;
white-space:nowrap;
}
In this case container will have intrinsic width of its content (white-space:nowrap; display: table-cell;)
精彩评论