<div style="clear:both;height: XXXXpx;"> ...

Consultez la formation au référencement naturel Google de WebRankInfo / Ranking Metrics

marsupilami
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 199
Inscription: Ven Avr 02, 2004 14:16

<div style="clear:both;height: XXXXpx;"> ...

Message le Mer Aoû 11, 2004 1:43

Comme la majorité des Wri's semble utiliser les feuilles de style sans souci, quelqu'un saurait me dire si c'est du bidouillage que d'utiliser : <div style="clear:both;height: XXXXpx;"></div>. Mon container ne veut pas suivre les div que j'y mets et je ne suis pas loin de laisser tomber les CSS pour retrouver mon bons vieux tableaux tant cela m'énerve. Oui, je sais ... pas la peine d'en rajouter !
:cry:

Fluidex
WRInaute discret
WRInaute discret
 
Messages: 83
Inscription: Sam Juil 17, 2004 15:26

Message le Mer Aoû 11, 2004 9:44

L'attribut style sur un élément div est parfaitement correct. En revanche ce n'est pas élégant et à l'usage c'est rarement pratique.

Mon container ne veut pas suivre les div que j'y mets

Ca n'éclaire pas vraiment ton problème. Impossible de fournir une aide précise.

Réponse générique :
    - utiliser l'attribut style n'est pas faire une CSS
    - si ta div doit se comporter comme toutes les autres, définis un style en CSS pour l'élément div
    - si ta div a des caractéristiques spécifiques ajoutes lui un attribut class (ou id) et définis un style en CSS pour cette "class".

Il y a d'autres façons de procéder mais pour un début ce devrait être suffisant ?

marsupilami
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 199
Inscription: Ven Avr 02, 2004 14:16

Message le Mer Aoû 11, 2004 11:41

Fluidex a écrit:Il y a d'autres façons de procéder mais pour un début ce devrait être suffisant ?


Merci pour l'aide. Pour le moment je garde ma solution car il y a un mystère mais ça ne marche qu'avec ça (pour que cela soit stable) j'y ai passé des heures et sans doute que je ne maîtrise pas bien les relatifs et absolus etc. et tout ce qui permet de faire des positionnements un peu "évolués". Le plus exaspérant c'est que tout marche bien mais il y a ce fond "container" qui disparaît quand je rajoute des éléments (si je ne mets pas le clear...)
Très esthétique votre site, vous semblez sur une bonne lancée, bonne continuation ...

Fluidex
WRInaute discret
WRInaute discret
 
Messages: 83
Inscription: Sam Juil 17, 2004 15:26

Message le Mer Aoû 11, 2004 12:03

Et bien merci pour le compliment.

Pour en revenir au problème : un élément disparait généralement quand il est recouvert ou lorsqu'il a bougé.
Clear a un rapport avec les éléments flottants. Donc je suppose que tu utilises des éléments flottants ? Ce n'est pas toujours évidant à maîtriser, compte tenu notamment de quelques bugs vicieux de certains navigateurs.

Quoi qu'il en soit si ta div est un container c'est un peu normal qu'il soit "caché" par les éléments qui sont dedans ?
Enfin si tu veux une aide concrète tu mets un lien vers ta page en expliquant ce que tu veux, ou tu donnes sur le forum des bouts de code simples représentatifs du problème.

marsupilami
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 199
Inscription: Ven Avr 02, 2004 14:16

Message le Mer Aoû 11, 2004 15:22

Fluidex a écrit:Enfin si tu veux une aide concrète tu mets un lien vers ta page en expliquant ce que tu veux, ou tu donnes sur le forum des bouts de code simples représentatifs du problème.


Et bien par exemple :

body{background-image:url(../images/image.png);background-position:left top;background-repeat:repeat-y;margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;font-size:11px;}
img{border:none;}

#container{width:750px;padding:0 7px 0 8px;background-image:url(../images/container.png);}


Lorsque je mets plusieurs éléments en position à partir du top (exemple):

#element {
LEFT: 260px; position: absolute; top: 120px; HEIGHT: 60x; padding:10px ; width: 460px; background-color:#FFF; border-left: #9CC 1px dotted; border-right: #9cc 1px dotted; border-top: #9cc 1px dotted; border-bottom: #9cc 1px dotted; margin-top: 5px; margin-bottom: 5px
}

etc. mon fond (container) ne suit pas les éléments, sauf si je mets cette instruction dans ma page HTML :
<div style="clear:both;height:120px;"></div>
après le <DIV id=element>
</DIV>

J'ai également un menu en haut, et un "footer"

Ca n'est vraiment pas évident comme logique! Merci pour la proposition ...

Fluidex
WRInaute discret
WRInaute discret
 
Messages: 83
Inscription: Sam Juil 17, 2004 15:26

Message le Mer Aoû 11, 2004 18:41

mon fond (container) ne suit pas les éléments

Je ne suis pas sur de bien comprendre le sens de "suivre les éléments".

Ce qui est sur c'est que #container et #element ne peuvent pas interférer. Tu pourras mettre 1000 éléments comme #element dans ton #container que cela ne fera rien de plus à ton #container. #element étant position: absolute il reste transparent pour #container qui vit sa vie (hauteur, largeur ...) en parfaite indépendance.

Lorsque tu mets <div style="clear:both;height:120px;"></div> dans #container tu introduis un élément qui n'est pas position: absolute mais position: static. Il se crée alors une interaction entre le père et le fils.

remarque : clear:both n'a auncun effet puisqu'il n'y a pas d'objet flottant.

Tu devrais lire un peu la recommandation CSS2, tout deviendrait plus clair au moment du codage.


Monique
WRInaute accro
WRInaute accro
 
Messages: 1545
Inscription: Lun Sep 16, 2002 10:50

Message le Mer Aoû 11, 2004 18:46

Bonjour,

Les exemples et explications de ces 3 articles d'Openweb devraient t'aider à comprendre :
Initiation au positionnement

Amicalement,
Monique

marsupilami
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 199
Inscription: Ven Avr 02, 2004 14:16

Message le Mer Aoû 11, 2004 21:51

Merci à vous. Cela reste encore assez flou mais si je devais dire ce qui se passe "expérimentalement" (ce qui se produit avec le <div style="clear:both;height:120px;">) c'est comme si cela rendait visible les 120 pixels de haut du container cachés par l'lémément de cette même hauteur, et ainsi de suite. L'effet me convient, reste à savoir si c'est reproductible ou si c'est un effet indésirable qui moi m'arrange. Je vous tiens au courant si j'ai du nouveau ...

milkiway
WRInaute accro
WRInaute accro
 
Messages: 2227
Inscription: Mar Fév 03, 2004 3:00

Message le Mer Aoû 11, 2004 22:55

Fluidex a écrit:L'attribut style sur un élément div est parfaitement correct

C'est pourtant vraiment à l'encontre de la logique XHTML : le contenu (doit être) est séparé de la forme

Fluidex
WRInaute discret
WRInaute discret
 
Messages: 83
Inscription: Sam Juil 17, 2004 15:26

Message le Jeu Aoû 12, 2004 8:54

@marsupilami >
Oui l'effet est reproductible. Mais je te conseille t'utiliser position:relative pour #element et de modifier en conséquence (mettre des valeurs relatives) les propriétés top, left...

@milkiway>
1/ nous ne savons pas si marsupilami est en XHTML ou en HTML 4. D'ailleurs compte tenu de ses soucis je crois que ça n'a pas d'importance.
2/ l'attribut style est parfaitement correcte pour toutes les DTD XHTML y compris XHTML 2.0. A voir la recomandation.
3/ ni le W3C avec XHTML 2.0, ni mon post n'encourage l'utilisation de l'attribut style !
4/ l'attribut style permet une séparation (de la moins belle manière certes) entre contenu et forme, au sens ou l'élément et son contenu ne porte que la sémantique du contenu, et l'attribut style uniquement la présentation. En cela il y a bien séparation, et dont l"effet est strictement équivalent à ce qui est obtenu avec la feuille de style (aux règles de priorité près).

marsupilami
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 199
Inscription: Ven Avr 02, 2004 14:16

Message le Jeu Aoû 12, 2004 10:33

C'est adopté et j'apprécie ces conseils appliqués Juxtener car tu sembles bien maîtriser le sujet. Je ne vais pas chercher plus loin pour le moment, et je suis déjà super contente des résultats.


Formation recommandée sur ce thème :

Formation Référencement naturel Google : apprenez une méthode efficace pour optimiser à fond le référencement naturel dans Google de façon durable... Formation animée par Olivier Duffez et Fabien Facériès, experts en référencement naturel.

Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.

Lectures recommandées sur ce thème :



Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités