This is my 3 columns layout, why the contents of right column push down the contents of center column if I add a div with clear:both after first text block?!
This is an example:
well that's pretty logical
well that's pretty logical isn't it? that is what you tell it to do. Clearing elements means no other floats are allowed next to the elements.
yes it's true but how can I
yes it's true but how can I clear after image?
you could set display:
you could set display: block; to the image, if it's not floated it will not allow any elements left or right of it.
you could float the center
you could float the center column, which would allow you to clear floats within it and not be affected by floats outside - but that would limit your liquid design.
another thing you could do is to put the image inside a paragraph (either it's own, or the one it's currently next to) and use overflow: hidden; on that p to contain the float.