Modification CSS

Bonjour, je ne suis pas super bon en CSS, j'ai modifié la grandeur des icônes de mon site, mais j'aimerais modifier l'emplacement de certains textes, après pas mal d'essais, je ne suis arrivé à rien.
Comme des photos valent mieux qu'un grand discourt voici ce que j'ai :

http://cjoint.com/?BICnyx31Ywt

et ce que je voudrais avoir.

http://cjoint.com/?BICnyWsvJvA

L'adresse du site : http://cyrillemaurice.com/annuaire/

Je vous remercie pour l'aider précieuse que vous pourrez m'apporter.


Cyrille

Bonjour,
Ne serait-il pas plus simple de mettre les icones (de puce pour le moment) en tant qu'image simple et le texte en float? (ou vice-versa...)

Bonjour, merci pour votre réponse, le problème c'est que je ne vois pas vraiment comment faire.
Le css fait plusieurs milliers de lignes.

Vous pouvez utilisez Firebug (Extension de Firefox) vous pourrez alors voir les propriétés CSS qui s'appliquent pour chaque élément.

Oui j'ai l’extension.
Si j'ai bien compris cela se passe au niveau des lignes 723. Mais je ne vois pas comment remonter le texte à coté de la photo.

En fait si je comprends bien il faudrait que je mette <li class="subcat"> dans
<li class="maincat"> parce que la je pense qu'il est à l'extérieur non ?

Le souci, c'est que je n'arrive pas à trouver le fichier dans lequel faire la modification avec firebug.
Ça ne doit pas être bien compliqué une fois au bon endroit.

a écrit :
En fait si je comprends bien il faudrait que je mette <li class="subcat"> dans
<li class="maincat"> parce que la je pense qu'il est à l'extérieur non ?

Effectivement, c'est moins un problème de css que de structure de la page : il faut supprimer le li.subcat, et placer les liens qu'il contenait dans le li.maincat. Ensuite, et ensuite seulement, on peut s'amuser avec les css.

Par contre c'est un appel dynamique, il va donc falloir toucher à la boucle php qui appelle ces éléments, si vous voulez nous coller ici le code...

Par contre, si vous n'avez pas la main sur le code, ça va être compliqué.

Merci pour cette réponse
J'ai la main sur le code, mais je ne sais pas du tout dans quel fichier chercher.
Il y a pas mal de répertoires et de fichiers.

Peut etre ici list.tpl

{if !empty($categoriesList)}
<div class="column_in">
{for start=0 stop=3 step=1 value=columnNr}
{if $categoriesList|@count > $columnNr}
    <div class="menucategories">
    <ul>
{for start=$columnNr stop=$categoriesList|@count step=3 value=i}{assign var=category value=$categoriesList[$i] }
      <li class="maincat">
{if $setting.categoriesImages}
        <img src="{"/uploads/images_categories/$category.imageSrc"|resurl}" alt="{$category.name}" class="category_image"/>
{/if}
        <a href="{$category|objurl:'category'}" title="{$category.name}">{$category.name}</a>
        <span class="text_numbers">({$category.validatedSitesCount})</span>
		 <li class="subcat">
{foreach from=$category.subcategories value=subcategory}
        <a href="{$subcategory|objurl:'category'}" title="{$subcategory.name}">{$subcategory.name}</a>
{/foreach}
      </li>
      </li>
{if !empty($category.subcategories)}
      <li class="subcat">
{foreach from=$category.subcategories value=subcategory}
        <a href="{$subcategory|objurl:'category'}" title="{$subcategory.name}">{$subcategory.name}</a>
{/foreach}
      </li>
{/if}

{/for}
    </ul>
    </div>
{/if}
{/for}
</div>
{/if}

Ah oui c'est bien dans ce fichier qu'il faut bidouiller
En fait je me suis servi de TextCrawler, très efficace ce logiciel.

Maintenant il ne me reste plus qu'a trouvé quoi modifier. J'ai déjà fait quelques modifs, et je pense que je vais y arriver.

Voila ce que j'ai fait, c'est pas encore ca, mais ca avance, le problème c'est que les catégories sont sous les sous catégories, cela devrait etre l'inverse.
Et la police est en gras pour les sous catégories alors qu'elles ne le sont pas normalement.
A la base nous avons cela : http://cjoint.com/12sp/BICnyx31Ywt.htm
http://cyrillemaurice.com/annuaire/

Si vous avez une idée, n'hésitez pas Merci

{if !empty($categoriesList)}
<div class="column_in">
{for start=0 stop=3 step=1 value=columnNr}
{if $categoriesList|@count > $columnNr}
    <div class="menucategories">
    <ul>
{for start=$columnNr stop=$categoriesList|@count step=3 value=i}{assign var=category value=$categoriesList[$i] }
      <li class="maincat">

		{if !empty($category.subcategories)}

{foreach from=$category.subcategories value=subcategory}
        <a href="{$subcategory|objurl:'category'}" title="{$subcategory.name}">{$subcategory.name}</a>
{/foreach}

{/if}
	  
{if $setting.categoriesImages}
        <img src="{"/uploads/images_categories/$category.imageSrc"|resurl}" alt="{$category.name}" class="category_image"/>
{/if}
        <a href="{$category|objurl:'category'}" title="{$category.name}">{$category.name}</a>
        <span class="text_numbers">({$category.validatedSitesCount})</span>
      </li>
{*{if !empty($category.subcategories)}
      <li class="subcat">
{foreach from=$category.subcategories value=subcategory}
        <a href="{$subcategory|objurl:'category'}" title="{$subcategory.name}">{$subcategory.name}</a>
{/foreach}
      </li>
{/if}*}

{/for}
    </ul>
    </div>
{/if}
{/for}
</div>
{/if}

Bonsoir,

Désolé, je ne m'étais pas abonné au fil (et du reste, je n'ai jamais compris comment on s'abbonnait à un topic sur ce forum...).

Donc, suite à votre modif, pour avoir le dernier élément de la liste non écrit en gras, en css on pourrait écrire sans remettre en cause le fichier html :

.maincat a:last-child {
    font-weight: 400;
}

Par contre cela ne marchera qu'à partir d'IE8. Pour un site comme le vôtre ce n'est peut-être pas acceptable (quoi-que...).

Dans ce cas il va falloir avoir recours à une deuxième solution : mettre une classe dans le dernier élément a de la liste (par exemple class="maincatsub") et écrire à nouveau la css, de cette manière cette fois-ci :

.maincatsub {
    font-weight: 400;
}

Voilà voilà. Si vous êtes vraiment coincé et que je ne vous répond pas, ce sera sans doute par inattention au fil, vous pourrez alors me relancer par MP...

Bien à vous