inline-block, alternative? - javarea.de Forum powered by javarea.de

HTML-Quelltext

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:

CSS:

/* MENU */
#menuContainer{
     position: absolute;
     left: 0px;
     top: 30px;
     width: 18%;
     background: transparent; /* #F5F5F5 */
     padding: 20px 10px 1px 0px;
     height: auto;
     font-family: Verdana, Arial;
}

/*
### TODO ###
.MENU
     TITEL
     ITEM
         BASE,NAME
     SUB_ITEM
         NAME
*/

.menu{
      position: fixed;
      left: 0px;
      font-size: 10px;
      font-family: Verdana, Arial;
      background: inherit;
      width: inherit;
}

.menu .menuTitel {
      font-weight: bold;
      padding-left: 10px;
      padding-bottom: 3px;
      border-bottom: 1px solid #BFBFBF;
}

.menu .menuItem{
      height: 20px;
      background: white;
      border: 1px solid #BFBFBF;
      border-top: 0px solid black;
}

.menu .menuItem .menuItemBase{
      background: green;
      height: 100%;
      border: 0px solid red;
      width: 4px;
}

.menu .menuItem .menuItemName{
      vertical-align: middle;
      padding-left: 10px;
}


<div id='menuContainer'>
     <div class="menu">
          <div class="menuTitel">Menu_1</div>
          <div class="menuItem">
                <span class="menuItemBase">&nbsp;</span><span class="menuItemName">Kapitel_1</span>
          </div>
          <div class="menuItem">
                <span class="menuItemBase">&nbsp;</span><span class="menuItemName">Kapitel_2</span>
          </div>
     </div>
</div>