28172 sujets

CSS et mise en forme, CSS3

Hello tout le monde,

Je "débute" en css, enfin pas tout a fait mais je suis loin d'être un expert et je bloque sur un problème tout bête.

J'utilise 960 grid system pour faire une mise en page très simple servant à un vote. Le body est uniquement composé de 3 lignes comme celle-ci :

upload/53637-ScreenShot.jpg

Pour créer cette partie, je me suis servi de la grille 12 colonnes.

La structure est donc :
<grid1> (espace blanc)
<grid2> (espace orange avec le numéro)
<grid6> (esapce avec le nom de l'assoc)
<grid2> (bouton de vote)
<grid1> (espace blanc)

Je voudrai mettre un lien et un "hover" sur l'ensemble <grid2>+<grid6> et je ne trouve pas comment faire. J'ai essayé de créer des DIV pour englober les deux mais ca me met le b***** à chaque fois.

Quelqu'un aurait-il un conseil, une piste ou mieux, une solution !

Merci d'avance à tous,

Sébastien

PS : Ci dessous le code

index.html :
<div class="container_12">
		<div class="grid_1" style="min-height: 1px">
		</div>
		<div class="grid_2 omega" style="height: 136px; background-color: #ff9933; border: 2px #ff9933 solid;">
		<span class="nombre">1.</span>
		</div>
		
		<div class="grid_6 alpha" style="height: 136px; border: 2px #ff9933 solid;">
		<span class="association">Association ABC</span><span class="signe">+</span>
		</div>
		
		<div class="grid_2" style="height: 136px; background-color: #ff9933; border: 2px #ff9933 solid;">
		<img class="voteicon" src="./img/vote.png">
		</div>
		
		<div class="grid_1">
		</div>
	</div>