float left div

[raduenea]

Hi,

I have the following situation.

<style>

.test1 {
	width: 50%;
	float: left;
	background-color:#888;
}

.test2 {
	width: 50%;
	float: left;
	background-color:#999;
}

@media (max-width: 991px) {
	.test1 {
		width: 100%;		
		background-color:#888;
	}

	.test2 {
		width: 100%;		
		background-color:#999;
	}
 }

</style>

<div style="float:left; background-color:#578;">
<ul>
<li>unu</li>
<li>doi</li>
<li>trei</li>
<li>patru</li>
</ul>
</div>

<div>
	<div>
		<div class="test1">
		text text etxt
		</div>
		<div class="test2">
		ceva ceva ceva
		</div>
	</div>
	<div style="text-align:center; width:100%; background-color:#777;">
	lorel impsun
	</div>
</div>	

The problem is that it add me space in the top and bottom of the div menu. See attached, maked with red.

How can I get rid of that space ?

Thanks

[cyberRobot]

By default, browsers apply margins (or padding) to the <ul> tag. The white space can be removed by adjusting the top and bottom margin / padding in your style sheet.