httemplate/elements/xmenu.css

   1
   2 .webfx-menu, .webfx-menu * {
   3         /*
   4         Set the box sizing to content box
   5         in the future when IE6 supports box-sizing
   6         there will be an issue to fix the sizes
   7
   8         There is probably an issue with IE5 mac now
   9         because IE5 uses content-box but the script
  10         assumes all versions of IE uses border-box.
  11
  12         At the time of this writing mozilla did not support
  13         box-sizing for absolute positioned element.
  14
  15         Opera only supports content-box
  16         */
  17         box-sizing:                     content-box;
  18         -moz-box-sizing:        content-box;
  19 }
  20
  21 .webfx-menu {
  22         position:               absolute;
  23         z-index:                100;
  24         visibility:             hidden;
  25         width:                  154px;
  26         border:                 1px solid black;
  27         padding:                1px;
  28         background:             white;
  29         filter:                 progid:DXImageTransform.Microsoft.Shadow(color="#777777", Direction=135, Strength=4)
  30                                 alpha(Opacity=95);
  31         -moz-opacity:           0.95;
  32         /* a drop shadow would be nice in moz/others too... */
  33 }
  34
  35 .webfx-menu-empty {
  36         display:                block;
  37         border:                 1px solid white;
  38         padding:                2px 5px 2px 5px;
  39         font-size:              11px;
  40         /* font-family:         Tahoma, Verdan, Helvetica, Sans-Serif; */
  41         color:                  black;
  42 }
  43
  44 .webfx-menu a {
  45         display:                block;
  46         width:                  expression(constExpression(ieBox ? "100%": "auto"));    /* should be ignored by mz and op */
  47         height:                 expression(constExpression("1px"));
  48         overflow:               visible;
  49         padding:                2px 0px 2px 5px;
  50         font-size:              11px;
  51         font-family:            Tahoma, Verdan, Helvetica, Sans-Serif;
  52         text-decoration:        none;
  53         vertical-align:         center;
  54         color:                  black;
  55         border:                 1px solid white;
  56 }
  57
  58 .webfx-menu a:visited,
  59 .webfx-menu a:visited:hover {
  60         color:                  black;
  61 }
  62
  63 .webfx-menu a:hover {
  64         color:                  black;
  65         /* background:          #faf7fa; #f5ebf4; #efdfef; white; #BC79B8; */
  66         /* background:          #ffe6fe; */
  67         /* background:          #ffc2fe; */
  68         background:             #fff2fe;
  69         border:                 1px solid #7e0079; /*rgb(120,172,255);#ff8800;*/
  70 }
  71
  72 .webfx-menu a .arrow {
  73         float:                  right;
  74         border:                 0;
  75         width:                  3px;
  76         margin-right:   3px;
  77         margin-top:             4px;
  78 }
  79
  80 /* separtor */
  81 .webfx-menu div {
  82         height:                 0;
  83         height:                 expression(constExpression(ieBox ? "2px" : "0"));
  84         border-top:             1px solid #7e0079; /* rgb(120,172,255); */
  85         border-bottom:  1px solid rgb(234,242,255);
  86         overflow:               hidden;
  87         margin:                 2px 0px 2px 0px;
  88         font-size:              0mm;
  89 }
  90
  91 .webfx-menu-bar {
  92         /* i want a vertical bar */
  93         display:                        block;
  94
  95         /* background:          rgb(120,172,255);/*rgb(255,128,0);*/
  96         /* background:           #a097ed; */
  97         background:              #000000;
  98         /* border:                      1px solid #7E0079; */
  99         /* border:                      1px solid #000000; */
 100         /* border: none */
 101
 102         padding:                2px;
 103
 104         font-family:    Verdana, Helvetica, Sans-Serif;
 105         font-size:              11px;
 106
 107         /* IE5.0 has the wierdest box model for inline elements */
 108         padding:                expression(constExpression(ie50 ? "0px" : "2px"));
 109 }
 110
 111 .webfx-menu-bar a,
 112 .webfx-menu-bar a:visited {
 113         /* i want a vertical bar */
 114         display:                        block;
 115
 116         /* border:                              1px solid black; /*rgb(0,0,0);/*rgb(255,128,0);*/
 117         /* border: 1px solid black; /* #ffffff; */
 118         /* border-bottom: 1px solid black; */
 119         border-bottom: 1px solid white;
 120         /* border-bottom:       1px solid rgb(0,66,174);
 121         /* border-bottom: 1px solid black;
 122         border-bottom: 1px solid black;
 123         border-bottom: 1px solid black; */
 124
 125         padding:                        1px 5px 1px 5px;
 126
 127         /* color:                               black; */
 128         color:                          white;
 129         text-decoration:        none;
 130
 131         /* IE5.0 Does not paint borders and padding on inline elements without a height/width */
 132         height:         expression(constExpression(ie50 ? "17px" : "auto"));
 133 }
 134
 135 .webfx-menu-bar a:hover {
 136         /* color:                       black; */
 137         color:                  white;
 138         /* background:          rgb(120,172,255);        */
 139         /* background:          #BC79B8; */
 140         background:             #7E0079;
 141         /* border-left: 1px solid rgb(234,242,255);
 142         border-right:   1px solid rgb(0,66,174);
 143         border-top:             1px solid rgb(234,242,255);
 144         border-bottom:  1px solid rgb(0,66,174); */
 145 }
 146
 147 .webfx-menu-bar a .arrow {
 148         border:                 0;
 149         float:                  right;
 150 /*      vertical-align:         top; */
 151         width:                  3px;
 152         margin-right:   3px;
 153         margin-top:             4px;
 154 }
 155
 156 .webfx-menu-bar a:active, .webfx-menu-bar a:focus {
 157         -moz-outline:   none;
 158         outline:                none;
 159         /*
 160                 ie does not support outline but ie55 can hide the outline using
 161                 a proprietary property on HTMLElement. Did I say that IE sucks at CSS?
 162         */
 163         ie-dummy:               expression(this.hideFocus=true);
 164
 165         border-left:    1px solid rgb(0,66,174);
 166         border-right:   1px solid rgb(234,242,255);
 167         border-top:             1px solid rgb(0,66,174);
 168         border-bottom:  1px solid rgb(234,242,255);
 169 }
 170
 171 .webfx-menu-title  {
 172         color:                  black;
 173         /* background:          #faf7fa; #f5ebf4; #efdfef; white; #BC79B8; */
 174         background:             #7e0079;
 175 /*      border:                 1px solid #7e0079; /*rgb(120,172,255);#ff8800;*/
 176         padding:                3px 1px 3px 6px;
 177         display:                block;
 178         font-size:              13px;
 179         font-family:            Tahoma, Verdan, Helvetica, Sans-Serif;
 180         text-decoration:        none;
 181         color:                  white;
 182 /*      border:                 1px solid white; */
 183         border-bottom:          1px solid white;
 184 }
 185