Texto en listas justificado a la izquierda

[floren]

Hola familia:

Tengo el siguiente código

Código:

.breves { 
	background: #D2D3D5 url(images/bottom_r.gif) no-repeat right bottom;
	margin-top: 33px;
	float: left;
	text-align: left;
	width: 200px;
}

.b_right { 
	background: url(images/top_r.gif) no-repeat right top;
	width: 20px;
	float: right;
	height: 20px;
}

.breves ul{
	list-style-type: none;
	text-align: left;
	margin-top: 25px;
	margin-left: 0;
} 

.breves li{
	display: block;
	width: 100%;
	margin-left: 0;
	margin-top: 0;
	margin-bottom: 10px;
}

Y lo implemento de la siguiente manera:

Código HTML:

<div class="breves">
<div class="b_right"></div>	
<ul>
	<li>Prueba 1Prueba 1 Prueba 1Prueba 1</li>
	<li>Prueba 1Prueba 1</li>
	<li>Prueba 1Prueba 1</li>
	<li>Prueba 1Prueba 1</li>
	<li>Prueba 1Prueba 1</li>
	<li>Prueba 1Prueba 1</li>
	<li>Prueba 1Prueba 1</li>
	<li>Prueba 1Prueba 1</li>
</ul>
</div> 

Podéis verlo aquí.

El tema es que en IE me justifica el texto a la izquierda, pegado al borde de la caja, que es lo que quiero; sin embargo en Firefox me deja un espacio entre el borde y el texto de unos 20-25 px, ¿sabéis a qué se debe?

Gracias y saludos,

Floren