coins arrondis sur conteneur centré auto

coins arrondis sur conteneur centré auto - HTML/CSS - Programmation

Marsh Posté le 22-09-2009 à 14:52:40    

Bonjour,
J' utilise pour mon site un conteneur centré et je souhaiterais, pour amèliorer le visuel, que les angles soit arrondis et, pour donner du relief, ajouter une ombre portée.  
 
Ci dessous le code simplifié de ma page. Quelqu' un aurait-il une solution qui puisse répondre à mon souhait?
merci à ceux qui pourraient m'aider.  
 

Code :
  1. <?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  3. <head>
  4. <title>essai</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <style type="text/css">
  7. body {
  8. margin: 0;
  9. padding: 0;
  10. text-align: center;
  11. }
  12. #contenu {
  13. position: absolute;
  14. left: 50%;
  15. top: 50%;
  16. width: 968px;
  17. height: 580px;
  18. margin-top: -292px;
  19. margin-left: -490px;
  20. border: 4px solid #E1EE0E;
  21. background-color: #E90E2D;
  22. }
  23.     </style>
  24. </head>
  25.  
  26. <body bgcolor="#040303"><div id="contenu">
  27. <div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:1; left: 382px; top: 282px;"><font color="#FFFFFF" size="+3">Merci</font></div>
  28. </body>
  29.   </html>

Reply

Marsh Posté le 22-09-2009 à 14:52:40   

Reply

Marsh Posté le 22-09-2009 à 15:11:14    

Tu peux regarder ce post.
http://www.cssjuice.com/25-rounded [...] -with-css/
Mais tu vas devoir employer un éditeur de texte et non un machin qui te fait du code de porc.
En fait, pour le moment ton code simplifié est juste immonde (désolé) et en plus tu es en mode Quirks http://www.quirksmode.org/css/quirksmode.html

Reply

Marsh Posté le 22-09-2009 à 16:05:32    

Merci pour ta réponse David, je vais visiter ton lien et pour ce qui est du code, je ne suis absolument pas programmeur mais je veux juste faire un petit site sympa pour mon association alors... je découvre et rencontre bien sûr des obstacles.

Reply

Marsh Posté le 22-09-2009 à 16:16:13    

Dans ce cas, si tu n'es pas du métier, le plus simple est sans doute de mettre en place un CMS, avec un beau thème.
Regarde du coté de Wordpress par exemple
http://fr.wordpress.org/
Des exemples de thèmes gratuits
http://www.smashingmagazine.com/20 [...] ss-themes/

Reply

Marsh Posté le 22-09-2009 à 16:26:47    

Merci David, je regarde ça

Reply

Marsh Posté le 23-09-2009 à 13:57:43    

Pour faire ça simplement , tu as JQuery capable de le faire
http://malsup.com/jquery/corner/

Reply

Marsh Posté le 23-09-2009 à 14:14:23    

Lenoiche a écrit :

Pour faire ça simplement , tu as JQuery capable de le faire
http://malsup.com/jquery/corner/


'tain mais c'est du ballon ce plugin... merci Lenoiche.

Reply

Marsh Posté le 23-09-2009 à 14:27:56    

Jquery , c'est du bon , mangez en !!!

Reply

Marsh Posté le 24-09-2009 à 14:40:14    

Merci pour ce plus Lemoine je vais regarder ça, sympa

Reply

Marsh Posté le 24-09-2009 à 18:10:24    

on peut egalement utiliser les proprietes CSS de Mozilla et Safari
    * -moz-border-radius-topleft  / -webkit-border-top-left-radius
    * -moz-border-radius-topright / -webkit-border-top-right-radius
    * -moz-border-radius-bottomleft / -webkit-border-bottom-left-radius
    * -moz-border-radius-bottomright / -webkit-border-bottom-right-radius
 
tout en sachant que cela ne fonctionnera pa avec IE.
ça fonctionnera avec Chrome qui est basé sur webkit.

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed