Don't like ads? PRO users don't see any ads ;-)

style.css

By: rezaranger51 on Aug 3rd, 2012  |  syntax: CSS  |  size: 3.28 KB  |  hits: 38  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. @import url('reset.css');
  2. .body{
  3.         margin:0px auto;
  4.         padding: 0px;
  5. }
  6. #wrapper{
  7.         width:100%;
  8.         height:100%;
  9.         margin:0px auto;
  10. }
  11.  
  12. /*sebelah kiri*/
  13. #sidebar{
  14.         width:22%;
  15.         height:100%;
  16.         background:#E2E8EA;
  17.         float:left;
  18.         margin:0 px;
  19.         padding:0 px;
  20. }
  21.  
  22. #sidebar .wrapsearch{
  23.         width:100%;
  24.         height:11%;
  25.         background:white;
  26.         float:left;
  27.         margin:0 px;
  28.         padding:0 px;
  29. }
  30.  
  31. #sidebar .wraptabel{
  32.         width:100%;
  33.         height:39%;
  34.         float:left;
  35.         margin:0 px;
  36.         padding:0 px;
  37. }
  38.  
  39. #sidebar .wrapmenubawah{
  40.         width:100%;
  41.         height:50%;
  42.         BACKGROUND:#E7EDEF;
  43.         float:left;
  44. }
  45.  
  46.  
  47. /*end sebelah kiri*/
  48.  
  49.  
  50.  
  51. /*bagian kanan (konten)*/
  52. #tab{
  53.         width:78%;
  54.         height:100%;
  55.         background:#305378;
  56.         float:left;
  57.         margin:0 px auto;
  58.         padding:0 px;
  59. }
  60.  
  61.  
  62. /*menu*/
  63. #tab .menutab{
  64.         width:100%;
  65.         height:4%;
  66.         background:#black;
  67.         float:left;
  68.         padding:0 px;
  69.         margin : 0 px auto;
  70.         color:#305378;
  71. }
  72.  
  73. /*-------------*/
  74. /*MENU TAB KANAN*/
  75. /*-------------*/
  76. ul.tabs {
  77.         list-style:none;
  78.         margin:0 px auto ;
  79.         padding:0 px auto;             
  80.         height:35px;
  81.         float:left;
  82.         margin-top:0px;
  83.         color:#305378;
  84. }
  85.  
  86. /* single tab */
  87. ul.tabs li {
  88.         float:left;      
  89.         text-indent:0;
  90.         padding:0;
  91.         margin:0 !important;
  92.         list-style-image:none !important;
  93.         color:#305378;
  94. }
  95.  
  96. /* link inside the tab. uses a background image */
  97. ul.tabs a {
  98.         background: url(../img/tes.png) no-repeat -420px 0;
  99.         font-size:12px ;
  100.         font-family:arial;
  101.         display:block;
  102.         height: 25px;  
  103.         line-height:25px;
  104.         width: 71px;
  105.         text-align:center;     
  106.         text-decoration:none;
  107.         color:#333;
  108.         padding:0px;
  109.         margin:0px;    
  110.         position:relative;
  111.         top:1px;
  112.         float:left;
  113.         font-weight:bold;
  114.         color:#305378;
  115. }
  116.  
  117. ul.tabs a:active {
  118.         outline:none;
  119.         color:#305378;
  120.         float:left;
  121. }
  122.  
  123. /* when mouse enters the tab move the background image */
  124. ul.tabs a:hover {
  125.         float:left;
  126.         color:#305378;
  127.         text-decoration:underline;
  128. }
  129.  
  130. /* active tab uses a class name "current". it's highlight is also done by moving the background image. */
  131. ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
  132.         background-position: -420px -62px;             
  133.         cursor:default !important;
  134.         float:left;
  135.         color:#305378;
  136. }
  137.  
  138. /* Different widths for tabs: use a class name: w1, w2, w3 or w2 */
  139.  
  140. /* width 1 */
  141. ul.tabs a.s                     { background-position: -553px 0; width:81px; }
  142. ul.tabs a.s:hover       { background-position: -553px -31px; }
  143. ul.tabs a.s.current  { background-position: -553px -62px; }
  144.  
  145. /* width 2 */
  146. ul.tabs a.l                     { background-position: -248px -0px; width:174px; }
  147. ul.tabs a.l:hover       { background-position: -248px -31px; }
  148. ul.tabs a.l.current  { background-position: -248px -62px; }
  149.  
  150. /* width 3 */
  151. ul.tabs a.xl                    { background-position: 0 -0px; width:248px; }
  152. ul.tabs a.xl:hover      { background-position: 0 -31px; }
  153. ul.tabs a.xl.current { background-position: 0 -62px; }
  154.  
  155. /* initially all panes are hidden */
  156. div.panes div.pane {
  157.         display:none;
  158.         margin-top:-5px;
  159. }
  160.  
  161. /* tab pane styling */
  162. #panes{
  163.         display:none;          
  164.         border:1px solid #999;
  165.         padding:0px;
  166.         border-top:0;
  167.         font-size:14px;
  168.         background-color:black;
  169.         height:50%;
  170.         width:100%;
  171.         float:left;
  172.         margin-top:-10px;
  173. }
  174. #panes .mapmonitor{
  175.         width:100%;
  176.         height:83%;
  177.         float:left;
  178.         margin:0px;
  179.         padding:0px;
  180.        
  181. }
  182. /**/
  183.  
  184. /*end bagian kanan*/