Deprecated: Assigning the return value of new by reference is deprecated in /var/www/sdb/8/f/dev.art/wordpress/wp-settings.php on line 472

Deprecated: Assigning the return value of new by reference is deprecated in /var/www/sdb/8/f/dev.art/wordpress/wp-settings.php on line 487

Deprecated: Assigning the return value of new by reference is deprecated in /var/www/sdb/8/f/dev.art/wordpress/wp-settings.php on line 494

Deprecated: Assigning the return value of new by reference is deprecated in /var/www/sdb/8/f/dev.art/wordpress/wp-settings.php on line 530

Strict Standards: Declaration of Walker_Page::start_lvl() should be compatible with Walker::start_lvl(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 594

Strict Standards: Declaration of Walker_Page::end_lvl() should be compatible with Walker::end_lvl(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 594

Strict Standards: Declaration of Walker_Page::start_el() should be compatible with Walker::start_el(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 594

Strict Standards: Declaration of Walker_Page::end_el() should be compatible with Walker::end_el(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 594

Strict Standards: Declaration of Walker_PageDropdown::start_el() should be compatible with Walker::start_el(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 611

Strict Standards: Declaration of Walker_Category::start_lvl() should be compatible with Walker::start_lvl(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 705

Strict Standards: Declaration of Walker_Category::end_lvl() should be compatible with Walker::end_lvl(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 705

Strict Standards: Declaration of Walker_Category::start_el() should be compatible with Walker::start_el(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 705

Strict Standards: Declaration of Walker_Category::end_el() should be compatible with Walker::end_el(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 705

Strict Standards: Declaration of Walker_CategoryDropdown::start_el() should be compatible with Walker::start_el(&$output) in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/classes.php on line 728

Strict Standards: Redefining already defined constructor for class wpdb in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/wp-db.php on line 306

Deprecated: Assigning the return value of new by reference is deprecated in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/cache.php on line 103

Strict Standards: Redefining already defined constructor for class WP_Object_Cache in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/cache.php on line 425

Deprecated: Assigning the return value of new by reference is deprecated in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/query.php on line 21

Deprecated: Assigning the return value of new by reference is deprecated in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/theme.php on line 623

Strict Standards: Redefining already defined constructor for class WP_Dependencies in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/class.wp-dependencies.php on line 15

Strict Standards: call_user_func_array() expects parameter 1 to be a valid callback, non-static method Wordics::myWordics_init() should not be called statically in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/plugin.php on line 311
Développement et arts numériques » Un onglet à longueur variable : une balise
Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/kses.php on line 947

Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /var/www/sdb/8/f/dev.art/wordpress/wp-includes/kses.php on line 948
Home > Web > Un onglet à longueur variable : une balise

Un onglet à longueur variable : une balise

février 21st, 2010

Présentation

Au cours d’une formation html/css, nous devions réaliser une copie conforme d’un site web (dont je tairais le nom), celui-ci comportait un onglet actif.

Dans une recherche de la moindre balise, j’ai voulu n’utiliser aucun artifice et laisser cette simple balise dessiner un onglet à largeur modifiable.

La solution

Voici la solution:
test de lien
lien2
Et le code css pour la faire fonctionner:

a.onglet{text-decoration: none; text-transform: capitalize; color: #4d4d4d; text-shadow: 5px 5px 5px #bfbfbf;}
a.onglet:hover {color: #0000ff;}			
a.onglet:after {content: url("http://dev.art.free.fr/wordpress/wp-content/2010/02/top_corner_ne.png"); vertical-align: -5px;}			
a.onglet{ background: url("http://dev.art.free.fr/wordpress/wp-content/2010/02/top_corner_nw.png") no-repeat; padding-left: 20px; padding-top: 7px; line-height: 30px; padding-bottom: 5px; font-size:16px;}

Compatibilité

Cette astuce fonctionne avec :

  • Firefox
  • Opéra
  • IE8
  • Chrome

L’ombre dernière le texte, idem sauf IE.
Pour les autres navigateurs, vos commentaires sont les bienvenus.

Bon développement.

Author: Nicolas de Marqué Categories: Web Tags:
  1. No comments yet.
  1. août 16th, 2014 at 10:02 | #1
  2. août 17th, 2014 at 02:37 | #2
  3. août 18th, 2014 at 05:41 | #3
You must be logged in to post a comment.