Question

Hi i am trying to create my first fluid responsive layout and i am having a little problem , on the right i have a container that is longer than the boxes beside it and so i am trying to fit a box in the gap, you can see here: http://www.security-vacancies.net/test/fluid_test.html I am trying to get the purple box up and along side the grey box but it keeps starting again on a new line.

Here is my code for the two boxes.

 #job_seach {
clear: none;
float: left;
margin-left: 2.0408%;
width: 28.5714%;
display: block;
background-color:#CCC;
 }
 #lates_jobs {
clear: both;
float: left;
margin-left: 0;
width: 40.3877%;
display: block;
background-color:#909;
    }

Any suggestions would be much appreciated thanks.

Lee

Answer 1

There is no space left for the purple box to follow the grey box(along side the grey box), that’s why its going to a new line. If you want it to follow you will have to make space for it. Try, decreasing size of other div’s and of your purple box if you want to squeeze it in.