[css]débordement titre css

Bonjour,

Je cherche a créer un style particulier pour mon site, c'est à dire faire un "titre" qui déborde sur le coté.Je vous est fait un imprime écran pour bien me faire comprendre:

http://www.hebergement-images-gratuit.com/images/2014/06/09/Sans_titre.png

#bartitle{
	background-image: url(img/bartitle1.png);
	background-repeat:repeat-x;
	height:37px;
	margin-top:10px;
	text-decoration:none;
	width:150px;
	color: #ffffff;
z-index:1;
}
#bartitle:after{
	content: url(img/bar_after.png);
	background-repeat:no-repeat;
	position: absolute;
	height:37px;
	text-decoration:none;
	color: #ffffff;
	z-index:1;
	left:-10px;
}

	 <article id="contenue1">
	         <div class="colleft">
	    <div class="col1">
	        <div id="barleft">test de la bar</div>
			<div id="bloc">test 01</div>
			
						Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin et felis nisi. Phasellus luctus gravida erat et aliquet. Praesent ac fermentum eros. Mauris et laoreet risus. Phasellus urna orci, consequat ac libero vel, ullamcorper lobortis dolor. Mauris fermentum sollicitudin risus, vel feugiat enim lobortis sit amet. Nunc feugiat mattis ipsum, a posuere enim euismod lacinia. Sed commodo tempor massa a convallis.
Sed ornare urna eget ligula pretium convallis. Vestibulum ullamcorper nibh in felis accumsan elementum vitae nec felis. Aliquam consectetur ultricies aliquam. Nam ullamcorper cursus velit, eget fermentum dolor convallis ut. Sed varius vel nisl quis commodo. Integer rutrum pharetra pulvinar. Sed consectetur placerat tortor, vitae tempus dui venenatis vel. Integer porttitor interdum diam vel malesuada.
M

			</div> 
			<div class="col2">
				<?php include("/home/infinityr/www/news/show_news.php"); ?>
			</div>
	 </article>

Un margin-left à #bartitle ?