28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je rencontre quelques problèmes avec mon site. Le premier souci, le lien en bas dans barre latérale est en conflit avec le format des liens de ma barre de navigation. Au lieu de prendre le style des liens normaux il prend le style de la "navbare". Second soucis, j'ai crée un petit bloc, mais quand je le met en place j'ai des defauts ur la page "image" ou sur mon index, tout par en vrille alors que sur les autres pages pas de soucis, j'ai l'impression que se sont les images qui foute le bord*$!...

http://onirike.free.fr
Modifié par otsoa (22 May 2009 - 08:33)
Salut,

Pour le style de ton lien dans le sidebar, l'erreur provient de la ligne 24 de ton fichier style_forme.css. Tu appliques en effet le même style à tes liens visités qu'à tes liens de la sidebar. Il vaut donc mieux modifier le code par :

#navigation a:link, #navigation a:visited {
...
}


Pour ton second problème, je pense que ça provient du style float:left appliqué à la class illustration. Je pense que l'en rajoutant un div annulant l'effet float:left à la suite tes blocs ça devrait mieux s'afficher.

<div class="illustration">
...
</div>
<div class="clear"></div>

Et dans ton css

.clear{
  clear:both;
}


Normalement, tout devrait s'afficher selon tes désirs Smiley cligne

Ps : Pour info, sur ta page tu as écris norme WC3 alors que c'est W3C
Modifié par laurent35240 (14 May 2009 - 21:18)
Merci ça fonctionne Smiley lol . La différence entre les pros et les bricoleurs comme moi Smiley cligne .
Par contre j'ai encore un dernier petit truc, si je "resize" ma page dans le navigateur pour simuler une petite résolution j'ai ma page/"div contenu"") qui écrase ma sidebar.
En gardant le layout actuel, est il possible d'empêcher cet écrasement du texte ou au moins de mètre un padding ou une marge entre le texte et le contenu de droite !?
Tu as un problème de sémantique quelque part...

Trop de div ouverts et pas fermés au bon moment.

> Clarifie ton code, indente-le !!


Une fois cela fait, je penses que tu y verras plus clair.
Re-salut,

Bon il a fallu que je me plonge un peu plus dans ton code pour trouver une solution rapide pour améliorer ton positionnement. Smiley smile

Il faut modifier les propriétés de positionnement de ton sidebar :
- vire position: absolute
- rajoute float: left

+ modifier les marges de ta div #contenu :
- virer les margin-right: auto et margin_left: auto

Je te conseille de lire http://www.barelyfitz.com/screencast/html-training/css/positioning/ afin de comprendre comment marche le positionnement CSS.
Ca peut facilement devenir casse tête quand on mélange ces propriétés Smiley confus

Bonne continuation pour ton site perso
Effectivement, je vais re-potasser ça parce que là, c'est un peu lourd ce que j'ai fait. Merci pour votre aide en tout cas j'ai déjà résolu pas mal de coquilles Smiley lol .