Problème positionnement CSS
Fermé
Darkh
-
24 août 2012 à 17:33
Darkh62 Messages postés 14 Date d'inscription vendredi 24 août 2012 Statut Membre Dernière intervention 18 octobre 2014 - 24 août 2012 à 18:18
Darkh62 Messages postés 14 Date d'inscription vendredi 24 août 2012 Statut Membre Dernière intervention 18 octobre 2014 - 24 août 2012 à 18:18
A voir également:
- Problème positionnement CSS
- Test de positionnement cesi - Forum Études / Formation High-Tech
- Enlever couleur lien css ✓ - Forum CSS
- Css premier plan ✓ - Forum CSS
- Exemple test de positionnement greta - Forum Études / Formation High-Tech
- Logiciel positionnement gratuit - Guide
1 réponse
prosthetiks
Messages postés
1189
Date d'inscription
dimanche 7 octobre 2007
Statut
Membre
Dernière intervention
12 juin 2020
431
Modifié par prosthetiks le 24/08/2012 à 18:16
Modifié par prosthetiks le 24/08/2012 à 18:16
Hello,
un exemple vaut mieux qu'un long discours:
++
un exemple vaut mieux qu'un long discours:
<html> <head> <title></title> <meta charset="utf8"> <style type="text/css"> #global li{ margin: 30px; list-style: none; } .box{ width: 500px; padding:20px 50px; display : table-cell; vertical-align: middle; background-color: #999; height: 50px; border-radius: 10px; color: white; position: relative; text-transform: uppercase; text-align: center; border-top: #ccc double 3px; background: #9695a5; /* Old browsers */ background: -moz-radial-gradient(center, ellipse cover, #9695a5 0%, #474747 100%); /* FF3.6+ */ background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#9695a5), color-stop(100%,#474747)); /* Chrome,Safari4+ */ background: -webkit-radial-gradient(center, ellipse cover, #9695a5 0%,#474747 100%); /* Chrome10+,Safari5.1+ */ background: -o-radial-gradient(center, ellipse cover, #9695a5 0%,#474747 100%); /* Opera 12+ */ background: -ms-radial-gradient(center, ellipse cover, #9695a5 0%,#474747 100%); /* IE10+ */ background: radial-gradient(ellipse at center, #9695a5 0%,#474747 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9695a5', endColorstr='#474747',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .step{ position: absolute; top:5px; left: 5px; font-size: 6pt; } #global li a{ text-decoration: none; text-transform: uppercase; } </style> </head> <body> <div id="global"> <ul> <li> <a href="#"> <div class="box"> <div class="step">Etape 1</div> Une inscription 100% gratuite sur notre site </div> </a> </li> <li> <a href="#"> <div class="box"> <div class="step">Etape 2</div> J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites J'accède à des offres gratuites </div> </a> </li> <li> <a href="#"> <div class="box"> <div class="step">Etape 3</div> Je remplis gratuitement les offres proposées et je<br />gagne des euros </div> </a> </li> </ul> </div> </body> </html>
++
24 août 2012 à 18:18
Si j'ai bien compris il faut donc que je rajoute une div a chaque fois ?
Sachant que la div "global je la possède déjà.