Petit problème de portabilité sous IE
Bonjour, je suis actuellement en train d'intégrer une charte graphique au nouveau site corporate de l'entreprise, le choix pour porter la structure du site est Drupal 7.x, hors je me voit confronté à un petit souci dans la forme de mon menu sous internet explorer ( testé sous 9 ), les li du menu déborde vers le bas.
Tout fonctionne très bien sous Chrome, Firefox, Opéra, Safari.
Les sources :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
| <div id="site-wrapper">
<div id="page">
<!-- menu-wrapper -->
<div id="menu-wrapper">
<!-- sidebar_first -->
<?php if( $page['sidebar_first'] ) : ?>
<div id="sidebar-first" class="column sidebar">
<div class="section">
<!-- logo -->
<?php if( $logo ) : ?>
<a href="<?php print $front_page ; ?>" title="<?php print t('Home') ; ?>" rel="home" id="logo">
<img src="<?php print $logo ; ?>" alt="<?php print t('Home') ; ?>" />
</a>
<?php endif ; ?>
<!-- /logo -->
<!-- main_menu -->
<?php if( $main_menu ) : ?>
<div id="main-menu">
<?php print theme( 'links__system_main_menu', array(
'links' => $main_menu,
'attributes' => array(
'id' => 'main-menu-links',
'class' => array( 'links', 'clearfix' ),
),
'heading' => array(
'text' => t('Main menu'),
'level' => 'h2',
),
)) ;
?>
</div>
<?php endif ; ?>
<!-- /main_menu -->
<?php print render( $page['sidebar_first'] ) ; ?>
</div>
</div>
<?php endif ; ?>
<!-- /sidebar_first -->
</div>
<!-- /menu-wrapper -->
<!-- main-wrapper -->
<div id="main-wrapper">
<div id="main">
<!-- content -->
<div id="content" class="column">
<div class="section">
<a id="main-content"></a>
<?php print render( $title_prefix ) ; ?>
<?php if( $title ) : ?>
<h1 class="title" id="page-title">
<?php print $title ; ?>
</h1>
<?php endif ; ?>
<?php print render( $title_suffix) ; ?>
<?php if( $tabs ) : ?>
<div class="tabs">
<?php print render( $tabs ) ; ?>
</div>
<?php endif ; ?>
<?php print render( $page['help'] ) ; ?>
<?php if( $action_links ) : ?>
<ul class="action-links">
<?php print render( $action_links ) ; ?>
</ul>
<?php endif ; ?>
<?php print render( $page['content'] ) ; ?>
<?php print $feed_icons ; ?>
</div>
</div>
<!-- /content -->
<!-- footer-wrapper -->
<div id="footer">
<div class="section">
<?php if( $page['footer'] ) : ?>
<div id="footer" class="clearfix">
<?php print render( $page['footer'] ) ; ?>
</div>
<?php endif ; ?>
</div>
</div>
<!-- /footer-wrapper -->
</div>
</div>
<!-- /main-wrapper -->
</div>
</div> |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| /* CSS Document */
/* General */
html, body { margin: 0; padding: 0; height: 100%; }
#site-wrapper { height: 100%; }
#page { height: 100%; }
/* Sidebar-first ou Barre gauche { #menu-wrapper } */
#menu-wrapper { height: 100%; float: left; background-color: #1A1A1A; border-right: 3px solid #F49B01; }
#block-system-main-menu ul { padding: 0; margin: 0; }
#block-system-main-menu li.leaf { background-color: #000000; margin: 0; padding: 0; margin-bottom: 1px; padding-bottom: -19px; }
#block-system-main-menu li.leaf a {
text-decoration: none;
color: #FFFFFF;
font-size: 13px;
font-family: Tahoma, Geneva, sans-serif ;
display: block;
padding: 7px;
padding-left: 20px;
margin: 0;
}
#block-system-main-menu li.leaf a:hover { color: #000000; background-color: #F49B01; }
#block-system-main-menu ul li.leaf { list-style-type: none ; list-style: none; list-style-image: none; }
/* main-wrapper */
#main-wrapper { height: 100%; float: left; }
#content { height: 80%; }
#footer { height: 20%; } |
Le menu est généré sous la forme suivante :
Citation:
<ul><li><a /></li><li><a /></li> .... </ul>
