Search code examples
htmlcsswidth

how to use min-width, max-width and width 100%


Anybody please help me describing a suitable example of min-width max-width and width 100% and why should I use this specially for?

Edit

what should I use for min-width that most computers resolution may match. what should I use for max-width that most computers resolution may match.

Edit I need better example as yahoo.com use


Solution

  • min-width: If you set it 50px, then by default your div will be of width 50px. If the content inside the div has more width than 50px, then it(your div with min-width) will expand.

    max-width: If you set it 50px and if the content inside the div has more width than 50px, then it(your div with max-width) will not expand, a horizontal scroll may appear depending on your overflow settings.

    width:100% By default divs are of width 100% but if you have floating divs and you want to them to take all the horizontal space of their container, width:100% does help there.