28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

je planche sur une technique de zone visible d'une image redimensionnable en plein écran via un masque sous forme de div.

J'utilise la technique overflow hidden avec mon premier div (un wrapper) qui englobe le tout.

Voici mon code html (technique de plein écran redimensionnable avec un tableau):

<div class="bgBloc">
<div class="bgBis">
<div>
<table cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="images/bg02Bis.jpg" alt=""/>
</td>
</tr>
</table>
</div>
</div>
</div>

et mon css :

.bgBis, .bgBis table, .bgBis td {
height:100%;
width:100%;
overflow:hidden;
}

.bg {
position:absolute;
z-index:1;
}


.bgBis div {
height:200%;
left:-50%;
position:fixed;
top:-50%;
width:200%;
}

.bgBis td {
text-align:center;
vertical-align:middle;
}

.bgBis img {
margin:0 auto;
min-height:50%;
min-width:50%;
display:block;
}

Voilà, une personne pourrait m'éclairer ?

Merci ! Smiley biggrin
Bonjour Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien "Aide" qui apparaît tout en haut du forum est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif
rteddy a écrit :
Voilà, une personne pourrait m'éclairer ?

Non, car tu n'as pas posé de question.