Disposizione immagini

[simo22]

Ciao a tutti,
Ho fatto questo css per creare un elenco semplice dove mettere immagine + descrizione a lato:

HTML:

<div style="background-color: rgb(146, 247, 255);">


		<div class="container">
			<div class="content">
			<span class="userid">ale-cigno</span>

			Call of Duty&reg;: Black Ops			</div>
			<div style="background-image: url(&quot;http://eu.playstation.com//PSN_Image...001005003l.png);&quot;);" class="image"></div>
		</div>
</div>

CSS:

.container {
	background-color: gray;
	border: 1px solid black;

	margin-top: 3px;
	margin-left: 5px;
}
.content {
	margin-left: 50px;
}
.userid {
	font-size: 14px;
	color: white;
	
}
.image{
	height:45px;
	width:45px;
}

Ma il problema è che l'immagine è invisibile e non so come disporla a sinistra a simulare una tabella.
Grazie mille!

[yeelach]

Ciao simo22
Potresti provare ad impostare ai due div un float.
Nel caso tuo dovresti dare un

position:relative;
float:left;

Spero di esserti stato d'aiuto.

[Mich_]

HTML:
<div id="container">
  <dl>
    <dt>ale-cigno
Call of Duty&amp;copy;: Black Ops</dt>
    <dd>[img]...[/img]</dd>
    ...
  </dl>
</div>

CSS:
#container {
  ...
}
#container ul {
  ...
  width: ...;
}
#container dt {
  float: left;
  width: ...;
}
#container dd {
  float: left;
}
#container img {
  ...
}

[simo22]

Grazie mille ad entrambi. Alla fine ho risolto così:

CSS:

.container {
	background-color: gray;
	border: 1px solid black;

	margin-top: 3px;
	margin-left: 5px;

	min-height: 50px;
}
.content {
	margin-left: 50px;
}
.userid {
	font-size: 20px;
	color: white;
}
.image{
	height:45px;
	width:45px;
	float:left;
}

HTML:

 <div class="container" >
<div class="image"></div>			
<div class="content">
<span class="userid">DarkAngel_96</span>

Red Dead Redemption			</div>
</div>