Cetrowanie dwóch divów w poziomie

Question

Mam dość proste pytanie. Mianowicie, czy jest jakiś inny sposób(mniej kodu) na wycentrowanie dwóch divów od tego:

CSS:

.mainmenu{
		width:100%;
		padding:5px 0;
	}
	.menucontainer{
		width:385px;
		margin:0 auto;
	}
	.banner{
		background-color:#dcd9d9;
		width:180px;
		height:170px;
		margin-right:25px;
		float:left;
	}
	.banner:last-child{
		margin-right:0px;
	}
	.menucontainer::after{
		content:"."; 
		visibility:hidden; 
		display:block; 
		height:0; 
		clear:both;
	}

HTML:  

 <div class="mainmenu">
                <div class="menucontainer">
                    <div class="banner">
                    </div>
                    <div class="banner">
                    </div>
                </div>    
   </div>    

Answer 1

</style>
.mainmenu{
	/*div zawsze wypełnia cały obszar 100% to troche bez sensu dawać*/
	padding:5px 0;
	text-align:center;
}
.banner{
	background-color:#dcd9d9;
	width:180px;
	height:170px;
	margin-right:25px;
	display:inline-block;
}
.banner:last-child{
	margin-right:0px;
}

</style>

<div class="mainmenu"> 
	<div class="banner"> </div>
	<div class="banner"> </div>
</div>

 

Banery robisz jako elementy blokowe w lini (display:inline-block;) dzieki temu możesz je potem centrować jak zwykłe elementy linijowe czyli (text-align:center;). wadą tego rozwiązania jest to ze jesli miedzy <div> ami bedzie jakis biały znak bedzie powodował on odstęp więc aby się tego pozbyć HTML powiniene wyglądac tak 

<div class="mainmenu"> 
	<div class="banner"> 
		//baner 1
	</div><div class="banner">
		//baner2
	</div>
</div>

lub też uwzglednić przerwe i zmniejszyć marginesy.

Comments

Robiłem też tak, ale mam zdefiniowany kolor zaznaczenia ::selection i gdy zaznacze te DIVy w Google Chrome to mam zaznaczenie domyślne niebieskie zamiast swojego czerwonego

---

??? Pewnie coś zepsułeś z tym ::selection przy zmienianie CSSa popatrz dobrze albo skorzystaj z walidatora.