Space between Categories box and logo wrapper

How do I get rid of the space, or atleast minimise the space between the Categories box and logo wrapper? I would ideally like to get it inline with the Home bar. I am not the best at explaining myself, so here is a pic. I am a noob in regards to css..

Find in your stylesheet.css

.leftBoxContainer, .rightBoxContainer {
	margin: 0em;
	border: 1px solid #9a9a9a;
	border-bottom: 4px solid #F500B8;
	margin-top: 1.5em;
	}

...and do this to it:-

.leftBoxContainer, .rightBoxContainer {
	margin: 0em;
	border: 1px solid #9a9a9a;
	border-bottom: 4px solid #F500B8;
	/*margin-top: 1.5em;*/
	}

Thanks, but it is not quite right. Now I have no gaps inbetween the other sideboxes.

OK... try this

EXISTING:-

.leftBoxContainer, .rightBoxContainer {
margin: 0em;
border: 1px solid #9a9a9a;
border-bottom: 4px solid #F500B8;
margin-top: 1.5em;
}

CHANGE TO

.leftBoxContainer, .rightBoxContainer {
margin: 0em;
border: 1px solid #9a9a9a;
border-bottom: 4px solid #F500B8;
margin-bottom: 1.5em;
}

That did the job! Thank you so very much fairestcape.

Where can I learn about using css better? Do you know of any books etc?

W3Schools is a good place to start.

Google for CSS Tutorials, then select the link for W3Schools.

Another focused way you could do this (leaving the .leftBoxContainer, .rightBoxContainer as is) is to add

#categories {margin-top: 0;}

which will only affect the one space you want to remove.

Thanks gjh42. Which is the best way? Or are they much of a muchness?

Thanks for that fairestcape. Looks like I have some learning to do!!

They both get the same results, except that the margin-bottom version will make a space below the bottom sidebox that cannot be collapsed. In most circumstances, that won't matter.

Often in CSS there are multiple ways to get the same results, sometimes with subtle differences that can be exploited for precise control.