MaxRom | Scripturi uCoz Romania

/* Tabs */
#tabs {
  background:url(http://emoldova.ucoz.net/images/bgtabs.png);
  padding:4px;
  float:left;
  clear:both;
  width:260px;
  margin-bottom:10px;
  }
   
  ul.tabs {
  margin: 0;
  padding: 0;
  float: left;
  list-style: none;
  height: 31px; /*--Set height of tabs--*/
  width:260px;
  }
  ul.tabs li {
  float: left;
  margin: 0;
  padding: 0;
  height: 31px; /*--Subtract 1px from the height of the unordered list--*/
  line-height: 31px; /*--Vertically aligns the text within the tab--*/
  border-left: none;
  margin-bottom: -1px; /*--Pull the list item down 1px--*/
  overflow: hidden;
  position: relative;
  }
  ul.tabs li a {
  text-decoration: none;
  background:url(http://emoldova.ucoz.net/images/tab2.gif);
  color: #000;
  display: block;
  font-size: 11px;
  text-transform:uppercase;
  font-weight:bold;
  padding: 0 8px;
  outline: none;
  cursor:pointer;
  }
  ul.tabs li a:hover {
  }
   
  html ul.tabs li.active, html ul.tabs li.active a, html ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/
  background:url(http://emoldova.ucoz.net/images/tab1.gif);
  color:#fff;
  }
   
   
  .tab_container {
  overflow: hidden;
  clear: both;
  float: left;
  background:url(http://emoldova.ucoz.net/images/bgtabs.png);
  padding:6px;
  width:248px;
  }
  .tab_content {
  padding: 10px 10px;
  font-size: 12px;
  background: #fff;
  }
   
   
  .tab_container #tab4 {
  padding:10px;
  font-family:Georgia;
  }
/* ----- */

<div id="tabs">
  <ul class="tabs">
  <li><a href="#tab1">Tab1</a></li>
  <li><a href="#tab2">Tab2</a></li>
  <li><a href="#tab3">Tab3</a></li>
</ul>
<div class="tab_container">
  <!-- Tab 1 -->
  <div id="tab1" class="tab_content">
CONTINUT 1
  </div>
   
  <!-- Tab 2 -->
  <div id="tab2" class="tab_content">
CONTINUT 2
  </div>
   
  <!-- Tab 3 -->
  <div id="tab3" class="tab_content">
  CONTINUT 3
  </div>
</div>
</div>