Home/ Questions/Q 6033745
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T05:31:42+00:00

i’d like to make a liquid box with rounded corners. i tried this example.

  • 0

i’d like to make a liquid box with rounded corners.
i tried this example. The problem i have with this example – it extends to the width of viewport! i tried removing width:100% from div.w1 selector but it didn’t help..
I want this box to be as flexible as possible. it should only extend its width and/or height depending on the size of content in div.w4 .

how do i do that??

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    it should only extend its width and/or
    height depending on the size of
    content in div.w4

    You should replace width: 100% with either float: left or display: inline-block.

    Either of those will give you the “shrink-wrap” behaviour you desire.

    float: left: http://jsfiddle.net/MvNWV/

    display: inline-block: http://jsfiddle.net/MvNWV/1/

    Just as an aside, did you know that CSS provides native rounded corners?

    border-radius: http://jsfiddle.net/MvNWV/2/

    http://caniuse.com/border-radius – they’re supported “everywhere”, except in IE older than version 9.

    For those browsers, you can use CSS3 PIE.

    • 0