[Résolu]Ecrire le menu à la verticale

[Laure_21]

#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.4
#~ Url du site : local
#~ Hébergeur / Soft : wampserver
#~ Informations Système :
----------------------------------------------
Cms Version: 1.11.4
Installed Modules:
CMSMailer: 5.2.1
CMSPrinting: 1.0.3
FileManager: 1.4.3
MenuManager: 1.8.4
MicroTiny: 1.2.5
ModuleManager: 1.5.5
News: 2.12.10
Search: 1.7.7
ThemeManager: 1.1.7

Config Information:
php_memory_limit:
process_whole_template:
output_compression:
max_upload_size: 2000000
url_rewriting: none
page_extension:
query_var: page
image_manipulation_prog: GD
auto_alias_content: true
locale:
default_encoding: utf-8
admin_encoding: utf-8
set_names: true

Php Information:
phpversion: 5.2.4
md5_function: On (Vrai)
gd_version: 2
tempnam_function: On (Vrai)
magic_quotes_runtime: Off (Faux)
E_STRICT: 0
memory_limit: 128M
max_execution_time: 30
output_buffering: 4096
safe_mode: Off (Faux)
file_uploads: On (Vrai)
post_max_size: 8M
upload_max_filesize: 2M
session_save_path: c:/wamp/tmp (0777)
session_use_cookies: On (Vrai)
xml_function: On (Vrai)
xmlreader_class: On (Vrai)

Server Information:
Server Api: apache2handler
Server Db Type: MySQL (mysqli)
Server Db Version: 5.1.36
Server Db Grants: Trouvé un privilège "GRANT ALL" qui semble être adapté

----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour,

J'ai un menu horizontal dans lequel je voudrais que le texte soit écris à la verticale.
Pour cela je voudrais rajouter le code suivant dans le css du menu:

Code :

-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);    
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

Mon problème c'est que lorsque je l'applique au menu, la rotation s'applique sur l'image du menu et le sous-menu. J'aimerais que dans mon cas cela s'applique uniquement sur le texte du premier niveau du menu.
Il me paraissait logique de le mettre ici :

Code :

nav.main-navigation > ul > li > a,
nav.main-navigation > ul > li.sectionheader span {  
    font-family: 'Oswald', Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: [[$white]];
    text-decoration: none;
    font-size: 13px;
    font-weight: 550;
    cursor: pointer;
    text-transform: uppercase;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);    
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

mais aucun changement.
En faite j'ai essayé un peu partout mais je n'arrive pas à trouver où modifier. De plus, je sais que ce n'est pas très compatible avec IE.
J'ai un peu honte de ma question mais pouvez-vous m'aidez?
Y-a-t-il d'autre solution pour réaliser ce que je souhaite faire?

D'avance merci.

[Laure_21]

#~~~~~ DEBUT BLOC A NE PAS SUPPRIMER ~~~~~
#~ Version du CMS: 1.11.4
#~ Url du site : local
#~ Hébergeur / Soft : wampserver
#~ Informations Système :
----------------------------------------------
Cms Version: 1.11.4
Installed Modules:
CMSMailer: 5.2.1
CMSPrinting: 1.0.3
FileManager: 1.4.3
MenuManager: 1.8.4
MicroTiny: 1.2.5
ModuleManager: 1.5.5
News: 2.12.10
Search: 1.7.7
ThemeManager: 1.1.7

Config Information:
php_memory_limit:
process_whole_template:
output_compression:
max_upload_size: 2000000
url_rewriting: none
page_extension:
query_var: page
image_manipulation_prog: GD
auto_alias_content: true
locale:
default_encoding: utf-8
admin_encoding: utf-8
set_names: true

Php Information:
phpversion: 5.2.4
md5_function: On (Vrai)
gd_version: 2
tempnam_function: On (Vrai)
magic_quotes_runtime: Off (Faux)
E_STRICT: 0
memory_limit: 128M
max_execution_time: 30
output_buffering: 4096
safe_mode: Off (Faux)
file_uploads: On (Vrai)
post_max_size: 8M
upload_max_filesize: 2M
session_save_path: c:/wamp/tmp (0777)
session_use_cookies: On (Vrai)
xml_function: On (Vrai)
xmlreader_class: On (Vrai)

Server Information:
Server Api: apache2handler
Server Db Type: MySQL (mysqli)
Server Db Version: 5.1.36
Server Db Grants: Trouvé un privilège "GRANT ALL" qui semble être adapté

----------------------------------------------
#~~~~~ FIN BLOC A NE PAS SUPPRIMER ~~~~~

Bonjour,

J'ai un menu horizontal dans lequel je voudrais que le texte soit écris à la verticale.
Pour cela je voudrais rajouter le code suivant dans le css du menu:

Code :

-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);    
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

Mon problème c'est que lorsque je l'applique au menu, la rotation s'applique sur l'image du menu et le sous-menu. J'aimerais que dans mon cas cela s'applique uniquement sur le texte du premier niveau du menu.
Il me paraissait logique de le mettre ici :

Code :

nav.main-navigation > ul > li > a,
nav.main-navigation > ul > li.sectionheader span {  
    font-family: 'Oswald', Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: [[$white]];
    text-decoration: none;
    font-size: 13px;
    font-weight: 550;
    cursor: pointer;
    text-transform: uppercase;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);    
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

mais aucun changement.
En faite j'ai essayé un peu partout mais je n'arrive pas à trouver où modifier. De plus, je sais que ce n'est pas très compatible avec IE.
J'ai un peu honte de ma question mais pouvez-vous m'aidez?
Y-a-t-il d'autre solution pour réaliser ce que je souhaite faire?

D'avance merci.