// works only in mozilla

<style type="text/css">
<!--

    option[value=ohcon]:before { content:url("ohc.gif"); }
    option[value=baerlin]:before { content:url("baer.gif"); }
    option[value=zendo]:before { content:url("zendo.gif"); }

-->
</style>

..

Select Company
<select>
  <option value="ohcon">Oliver Haag IT consulting</option>
  <option value="baerlin">Bärlin Partners</option>
  <option value="zendo">Zendo-Marketing</option>  
</select>

// only css3.0, preliminary

div#left_half  {
  float:left;
  width:calc(50% - 8px);
}

// unsigned list look the same in firefox and internet explore
// but firefox uses padding and ie uses margin to indent
// so if you want to eliminate the indent you mat set both

// here the top margin is negative too
// so the bullet list is written directly under the text
// and the bottom-margin of the p-tag can remain (needet elsewhere)

ul {
	padding-left: 15px;
	margin-left: 0px;
	margin-top: -10px;
	margin-bottom: 10px;
}

// firefox an internet explorer handle padding in div-elements with width differently
// you don't need a css browser hack, you can use two div-elements insteas
// the outer-div handles width
// the inner div handles padding

//html

<div id="left_text">
	<div class="paddingbox">
		<p>loem ipsum dolor ...</p>
	</div>
</div><!--left_text-->

//css
//padding: top right, bottom, left;

#left_text {
	width: 208px;
	float: left;
}
div.paddingbox {
	padding: 4px 8px 4px 8px;
}