Responsive layouts

I want to put these images in a row - not in a column.
Can't figure how.


And here is a link to this page:
http://www.wood-furniture.biz/index_fluid.htm

Thanks for help.

 

Use ul list instead of div or make those divs display inline.

Here's the example: http://stackoverflow.com/questions/...zontally-instead-of-vertically-using-css-only

 

Find this code in your stylesheet:
#img_cat {
width: 12em;
clip: rect(auto, auto, auto, auto);
left: auto;
right: auto;
top: auto;
bottom: auto;
position: relative;
height: auto;
}

and add "display: inline-block" to this selector. No need to change html or anything.

 

Now you have:

#img_cat {
width: 12em;
clip: rect(auto, auto, auto, auto);
left: auto;
right: auto;
top: auto;
bottom: auto;
position: relative;
height: auto;
}

Change that into (remove the rest):

#img_cat{
width:12em;
float:left;
}

Problem solved!

 

Thanks. It works.

Sorry. Did not work. Images are outside the 'div"

 

Glad to help Another thing is that you have some baaad html/css practises over there. For example, you have 4 divs with the same id - img-cat. ID should be unique within a document. But it could take some effort to clear this mess up, so you need to decide to rework your site or keep bad code but have it working

 

I see it. Fixed it. Added name for every div and added a few lines in CSS. No errors at all.

Thanks again.