Meniu categorii.

CSS

Cod:

Matched CSS Rules
.onglet_cat li {
display: inline-block;
line-height: 10px;
text-align: left ;
  vertical-align: top;
list-style-type: none;
}
.onglet_nactif {
background: #EF8D6B;
color: #fff;
text-shadow: 1px 1px 0px #E43B28;
margin-right: px;
padding: 3px;
padding-left: px;
padding-right: px;
-moz-border-radius: px;
-webkit-border-radius: px;
border-radius: px;
-moz-box-shadow: 0px 0px 2px 0px #EDE7CD;
-webkit-box-shadow: 0px 0px 2px 0px #EDE7CD;
-o-box-shadow: 0px 0px 2px 0px #EDE7CD;
box-shadow: 0px 0px 2px 0px #EDE7CD;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#EDE7CD, Direction=NaN, Strength=2);
text-transform: uppercase;
font-family: times new roman;
letter-spacing: -1px;
font-size: 16px;
-webkit-transition: all 0.4s ease-in;
-moz-transition: all 0.4s ease-in;
-o-transition: all 0.4s ease-in;
transition: all 0.4s ease-in;
cursor: pointer;
}
user agent stylesheetli {
display: ;
text-align: -webkit-match-parent;
}
Pseudo ::selection element
::selection {
background: #BAAEA0;
color: #ffffff;
}
Inherited from ul.onglet_cat
.onglet_cat {
list-style-image: none;
list-style-position: outside;
list-style-type: none;
text-align: center;
}
user agent stylesheetul, menu, dir {
list-style-type: ;
}
Inherited from div
Style Attribute {
text-align: center;
}
Inherited from td
p, td, th {
font-family: Verdana,Arial,Helvetica,sans-serif;
}
Inherited from table.three-col
user agent stylesheettable {
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
Inherited from td.bodyline
p, td, th {
font-family: Verdana,Arial,Helvetica,sans-serif;
}
Inherited from table.bodylinewidth
user agent stylesheettable {
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
Inherited from body
body {
cursor: url(http://i53.tinypic.com/2dc7q6a.png), auto;
}


user agent stylesheetul, menu, dir {
list-style-type: disc;
}
Inherited from div
Style Attribute {
text-align: center;
}
Inherited from td
p, td, th {
font-family: Verdana,Arial,Helvetica,sans-serif;
}
Inherited from table.three-col
user agent stylesheettable {
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
Inherited from td.bodyline
p, td, th {
font-family: Verdana,Arial,Helvetica,sans-serif;
}
Inherited from table.bodylinewidth
user agent stylesheettable {
border-collapse: separate;
border-spacing: 2px;
border-color: gray;
}
Inherited from body
body {
cursor: url(http://i53.tinypic.com/2dc7q6a.png), auto;
}


Index_Box

Cod:

<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
      <tr>
          <td valign="bottom">
  
 
<!-- DEBUT MODIF ONGLETS -->


   <script type="text/javascript">
   //<![CDATA[
var i = 0;

document.write('<div align="center">
<ul class="onglet">
 

<li onMouseOver="change_cat(0);" class="onglet_actif" id="cat_0"><img src="http://i49.tinypic.com/24zisld.png" </li> <li onMouseOver="change_cat(1);" class="onglet_nactif" id="cat_1">test 2</li> <li onMouseOver="change_cat(2);" class="onglet_nactif" id="cat_2">test 3</li>
<li onMouseOver="change_cat(3);" class="onglet_nactif" id="cat_3">test 4</li>
<li onMouseOver="change_cat(4);" class="onglet_nactif" id="cat_4">test 5</li>
<li onMouseOver="change_cat(5);" class="onglet_nactif" id="cat_5">test 6</li>
<li onMouseOver="change_cat(6);" class="onglet_nactif" id="cat_6">test 8</li>

</ul>
</div>
');

var compteur_cat = 0;

var anc_cat = 0;

var nom_cat = new Array('0','1','2','3','4','5','6');

 
function change_cat(numero)
{
 document.getElementById(nom_cat[anc_cat]).style.display = 'none';
 document.getElementById(nom_cat[numero]).style.display = 'block';
 document.getElementById('cat_'+nom_cat[anc_cat]).className = 'onglet_nactif';
 document.getElementById('cat_'+nom_cat[numero]).className ='onglet_actif';
 anc_cat = numero;
}

function capture_cat()
{
if(nom_cat[compteur_cat] == nom_cat[0])
{document.write('<table class="cat_forum" id="' + nom_cat[compteur_cat] + '" >');
}
else{
 document.write('<table class="cat_forum" id="' + nom_cat[compteur_cat] + '" style="display:none;">');
}
compteur_cat++;
}

//-->
</script>
<!-- BEGIN catrow --><!-- BEGIN tablehead -->

<script type="text/javascript">
<!--
capture_cat();
//]]>
</script>  

<!-- FIN MODIF ONGLETS -->

      <!-- END tablehead -->
      <!-- BEGIN cathead -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.cathead.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
          <!-- END inc -->
          <td class="{catrow.cathead.CLASS_CAT}" colspan="{catrow.cathead.INC_SPAN}" width="100%">
            <h{catrow.cathead.LEVEL} class="hierarchy">
                <span class="cattitle">
                  <a class="cattitle" title="{catrow.cathead.CAT_DESC}" href="{catrow.cathead.U_VIEWCAT}">{catrow.cathead.CAT_TITLE}</a>
                </span>
            </h{catrow.cathead.LEVEL}>
          </td>
          <td class="{catrow.cathead.CLASS_ROWPIC}" colspan="3" align="right"> </td>
      </tr>
      <!-- END cathead -->
      <!-- BEGIN forumrow -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.forumrow.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" alt="." /></td>
          <!-- END inc -->
          <td class="{catrow.forumrow.INC_CLASS}" align="center" valign="middle">
            <img title="{catrow.forumrow.L_FORUM_FOLDER_ALT}" src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
          </td>
          <td class="row1 over" colspan="{catrow.forumrow.INC_SPAN}" valign="top" width="100%" height="50">
            <h{catrow.forumrow.LEVEL} class="hierarchy">
                <span class="forumlink">
                  <a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a>

                </span>
            </h{catrow.forumrow.LEVEL}>

    <!-- [ DÉBUT DES MODIFICATIONS EFFECTUEES PAR LE FORUM DES FORUMS ] -->

          <div class="forum-stats"><font color="#D1BA88">{catrow.forumrow.POSTS} Mesaje , în  {catrow.forumrow.TOPICS} subiecte .</font></div>
    <div class="forum-description">
    <span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
    </div>
    <div class="forum-sousforum">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
            <span class="gensmall">
                <!-- BEGIN switch_moderators_links -->
                {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
                <!-- END switch_moderators_links -->

            </span>
          </td>
          <!-- BEGIN forum_link_no -->
          <td class="row3 over" align="center" valign="middle" height="90"><div style="width: 150px">
            <span class="gensmall">{catrow.forumrow.LAST_POST}</span></div>
          </td>
    

    <!-- [ FIN DES MODIFICATIONS EFFECTUEES PAR LE FORUM DES FORUMS ] -->

          <!-- END forum_link_no -->
          <!-- BEGIN forum_link -->
          <td class="row3" colspan="3" align="center" valign="middle" height="50"><span class="gensmall">{catrow.forumrow.forum_link.HIT_COUNT}</span></td>
          <!-- END forum_link -->
      </tr>
      <!-- END forumrow -->
      <!-- BEGIN catfoot -->
      <tr>
          <!-- BEGIN inc -->
          <td class="{catrow.catfoot.inc.INC_CLASS}" width="46"><img src="{SPACER}" height="0" width="46" /></td>
          <!-- END inc -->
          <td class="spaceRow" colspan="{catrow.catfoot.INC_SPAN}" height="1"><img src="{SPACER}" alt="" height="1" width="1" /></td>
      </tr>
      <!-- END catfoot -->
      <!-- BEGIN tablefoot -->
    </table></div><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Printscreen:

După cum se poate observa în imagine fiecare căsuţă / titlu ce reprezintă o categorie a forumului este poziţionat vertical . În schimb eu aş dori să fie poziţionat orizontal , astfel încât să apară precum o înşiruire de titluri sau imagini ( de la stânga la dreapta ) nu ceea ce se vede în imagine .

in css la codul acesta

Cod:

.onglet_nactif {
background: #EF8D6B;
color: #fff;
text-shadow: 1px 1px 0px #E43B28;
margin-right: px;
padding: 3px;
padding-left: px;
padding-right: px;
-moz-border-radius: px;
-webkit-border-radius: px;
border-radius: px;
-moz-box-shadow: 0px 0px 2px 0px #EDE7CD;
-webkit-box-shadow: 0px 0px 2px 0px #EDE7CD;
-o-box-shadow: 0px 0px 2px 0px #EDE7CD;
box-shadow: 0px 0px 2px 0px #EDE7CD;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#EDE7CD, Direction=NaN, Strength=2);
text-transform: uppercase;
font-family: times new roman;
letter-spacing: -1px;
font-size: 16px;
-webkit-transition: all 0.4s ease-in;
-moz-transition: all 0.4s ease-in;
-o-transition: all 0.4s ease-in;
transition: all 0.4s ease-in;
cursor: pointer;
}

adauga

Cod:

float: left;
display: inline;

Mulţumesc . S-a rezolvat .