Codage de catégorie [Résolu] Bouton_activeCodage de catégorie [Résolu] Bouton_hoverCodage de catégorie [Résolu] Fb-hoverCodage de catégorie [Résolu] Fb-active
AccueilForumÉquipe 
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
Codage de catégorie [Résolu] EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Codage de catégorie [Résolu] EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Codage de catégorie [Résolu] EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Codage de catégorie [Résolu] EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Codage de catégorie [Résolu] EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Codage de catégorie [Résolu] EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Codage de catégorie [Résolu] EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Codage de catégorie [Résolu] EmptySam 11 Fév 2023, 06:04 par Krager

Le Deal du moment :
Code promo Nike : -25% dès 50€ ...
Voir le deal

CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolusPartagez
 

Codage de catégorie [Résolu]

Voir le sujet précédent Voir le sujet suivant Aller en bas 
http://falonasynae.forumactif.com
Lyo
{ Membre }
{ Membre }

Féminin Messages : 65



Codage de catégorie [Résolu] Empty
Bonjour tout le monde ! J'ai un petit soucis que je n'arrive pas à résoudre... J'ai beau essayer tout ce que je peux, je n'arrive pas à trouver comment parvenir à "étirer" ma box, pour qu'elle prenne toute la largeur de la catégorie.
J'obtiens ceci : http://alejia.forum-canada.net/

Voici mon template index_box :
Code:
<table width="100%" border="0" cellspacing="1" cellpadding="0" align="center">
 <tr>
 <td valign="bottom">
 <!-- BEGIN switch_user_logged_in -->
 <span class="gensmall">{LAST_VISIT_DATE}<br />
 {CURRENT_TIME}<br />
 </span>
 <!-- END switch_user_logged_in -->
 <div class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC}</div>
 </td>
 <td class="gensmall" align="right" valign="bottom">
 <!-- BEGIN switch_user_logged_in -->
 <a class="gensmall" href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a><br />
 <a class="gensmall" href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a><br />
 <!-- END switch_user_logged_in -->
 <a class="gensmall" href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a>
 </td>
 </tr>
</table>
<!-- BEGIN catrow --><!-- BEGIN tablehead --><table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
 <tr>
 <th colspan="{catrow.tablehead.INC_SPAN}" nowrap="nowrap" width="100%" class="secondarytitle"> {catrow.tablehead.L_FORUM} </th>

 <th nowrap="nowrap" width="150"><div style="width:150px;">{L_LASTPOST}</div></th>
 </tr>
 <!-- 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="1" valign="top" width="100%" height="50">
       <table width="100%"><tbody><tr><td><h3 class="hierarchy">
                    
                                   <span class="boxcat1"><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></span></h3></td></tr></tbody></table>
        
                             
<span class="genmed">{catrow.forumrow.FORUM_DESC}</span>
 <span class="gensmall">
 <!-- BEGIN switch_moderators_links -->
 {catrow.forumrow.switch_moderators_links.L_MODERATOR}{catrow.forumrow.switch_moderators_links.MODERATORS}
 <!-- END switch_moderators_links -->
 {catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}
 </span>
 </td>
 
<td class="row3 over" align="center" valign="middle" height="50">
                  <span class="gensmall">{catrow.forumrow.LAST_POST}</span><br/>
          <span class="gensmall">{catrow.forumrow.POSTS} messages et {catrow.forumrow.TOPICS} sujets.</span>
 </td>
 </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><img src="{SPACER}" alt="" height="5" width="1" /><!-- END tablefoot --><!-- END catrow -->

Et mon CSS :
Code:
a { /*Enlève le soulignement des liens*/
text-decoration: none !important;
}
a:hover {
text-decoration: none !important;
}

/*POUR LES MESSAGES*/

.box {
  -webkit-box-shadow: 0px 0px 5px 0px #A9B4D6;
  box-shadow: 0px 0px 5px 0px #A9B4D6;
  background-color: #A9B4D6;
  border-radius: 7px;
  margin: 15px 15px 15px 15px;
  padding: 10px 10px 10px 10px;
}

.box2 {
  -webkit-box-shadow: 0px 0px 5px 0px #7B8D96;
  box-shadow: 0px 0px 5px 0px #7B8D96;
  padding: 5px 5px 5px 5px;
  text-align: justify;
  border-radius: 2px;
  line-height:11px;
  margin: -6px 0px;
}

.grandtitre {
  color: #ffffff;
  font-size: 20px;
  font-family: Perpetueta;
  text-transform: uppercase;
  -webkit-box-shadow: 0px 0px 5px 0px #7B8D96;
  box-shadow: 0px 0px 5px 0px #7B8D96;
  padding: 3px 3px 3px 3px;
  border-radius: 4px;
  text-align: center;
  letter-spacing: 3px;
}

.titre {
  color: #ffffff;
  font-size: 11px;
  text-transform: uppercase;
  -webkit-box-shadow: 0px 0px 5px 0px #7B8D96;
  box-shadow: 0px 0px 5px 0px #7B8D96;
  padding: 3px 3px 3px 3px;
  border-radius: 4px;
  text-align: center;
  letter-spacing: 3px;
}

.texte {
  color: #ffffff;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

/*CATEGORIES*/

.boxcat1 {
  background-color: #7B8D96;
  font-size: 20px;
  font-family: Perpetueta;
  text-transform: uppercase;
  -webkit-box-shadow: 0px 0px 5px 0px #7B8D96;
  box-shadow: 0px 0px 5px 0px #7B8D96;
  padding: 3px 3px 3px 3px;
  border-radius: 2px;
  text-align: center;
  letter-spacing: 3px;
  width: 100%;
  overflow: auto;
}

I need your help, ô dieux du codage  What a Face


Dernière édition par Lyo le Mar 31 Déc 2013, 08:40, édité 1 fois
MessageSujet: Codage de catégorie [Résolu]   Codage de catégorie [Résolu] EmptyMar 31 Déc 2013, 06:04
Revenir en haut Aller en bas
Nihil
Nihil
{ Modérateur }
{ Modérateur }

Messages : 1216



Codage de catégorie [Résolu] Empty
Bonjour Lyo,

Lyo a écrit:
Je n'arrive pas à trouver comment parvenir à "étirer" ma box, pour qu'elle prenne toute la largeur de la catégorie.
Tu parles du fond derrière les titre de forum, c'est ça (: ?
Si oui peux tu essayer de remplacer ceci :
Code:
<span class="boxcat1"><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></span>
Par cela ? :
Code:
<div class="boxcat1"><a class="forumlink" href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div>
MessageSujet: Re: Codage de catégorie [Résolu]   Codage de catégorie [Résolu] EmptyMar 31 Déc 2013, 07:08
Revenir en haut Aller en bas
http://falonasynae.forumactif.com
Lyo
{ Membre }
{ Membre }

Féminin Messages : 65



Codage de catégorie [Résolu] Empty
Oh merci beaucoup ! Je n'y avais pas pensé... Mais quelle est la différence entre span et div ?
MessageSujet: Re: Codage de catégorie [Résolu]   Codage de catégorie [Résolu] EmptyMar 31 Déc 2013, 07:13
Revenir en haut Aller en bas
Nihil
Nihil
{ Modérateur }
{ Modérateur }

Messages : 1216



Codage de catégorie [Résolu] Empty
La balise div est une balise dite "inline", et la balise div est dite "block". En gros, après une div, il y aura un retour à la ligne, et après un inline le contenu se mettra directement ^^

Par exemple, quand tu utilises une balise "a" pour faire un lien, c'est une balise inline, le texte continue de se mettre à la suite après.

Par contre, si tu utilises une balise "h1" pour mettre ton titre, après le texte reviendra à la ligne. Le H1 va former "tout un bloc" ^^.

Là où c'est intéressant, c'est qu'une balise de type bloc prendra par défaut 100% de la largeur de son conteneur... alors qu'une balise span aura une largeur correspondant à son contenu.

N'hésite pas à regarder ceci pour t'aider à mieux comprendre.

N'hésite pas à éditer le titre de ton sujet pour préciser "Résolu" ^^
MessageSujet: Re: Codage de catégorie [Résolu]   Codage de catégorie [Résolu] EmptyMar 31 Déc 2013, 07:27
Revenir en haut Aller en bas
Contenu sponsorisé




Codage de catégorie [Résolu] Empty
MessageSujet: Re: Codage de catégorie [Résolu]   Codage de catégorie [Résolu] Empty
Revenir en haut Aller en bas
 

Codage de catégorie [Résolu]

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Modification codage catégorie (2)
» Codage de catégorie - ( On le trouve sur pas mal de forums maintenant)
» Adapter onglets catégories pour le codage catégorie
» Soucis de codage [résolu]
» [Résolu] Problème de codage sur PA

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-
ChatBox
:
AccueilAccueil  RechercherRechercher  Dernières imagesDernières images  Connexion  S'enregistrerS'enregistrer  

Partenaires Or

← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Cookies | Forum gratuit