Reprise du message précédent :

ben celui dont on parle... euh les uns en dessous des autres...
<div class="page">
plein de trucs...
</div>
<div class="page">
plein de trucs...
</div>
<div class="page">
plein de trucs...
</div>
comme ça
 
bon, on s'excite pas, de toutes façons, c la mega merde avec le truc qui me servait à generer ces trucs, donc, je vais me rabbatre sur un vieux document qui pue, et basta
et une journée de perdue, une.

Perso, j'utilise les sauts de page comme ça :
 
<div>Du texte</div>
<div class="break></div>
<div>Du texte</div>
<div class="break></div>
<div>Du texte</div>
 
et
 
div.break {
  page-break-after: always;
}
 
Et comme ça pas de problème de page vide.

voui, mais alors je dois gerer l'absence ou la presence de ce div dans ma "boucle" de generation de pages
enfin bon, oui
(c comme ça que je faisais avant en fait )

Rhoooo ben c'est pas la mort à faire ça !

ben ça depend ds quelle contexte

Elle devient connue cette faq: http://www.nitot.com/standards/blo [...] p#83126383

Héhé il est sympa le T.Nitot. Sympa de voir une petite bande de fidèles confés et repentants faire un blog sur les standards

c qui pascale? une carpe?

C'est l'autheur de http://mammouthland.free.fr/cours/css/

 
Regarde le site de mammouthland dans la section "Encore plus"

Il parle certainement de Pascale de http://mammouthland.free.fr/ .C'est dans les les liens de http://www.nitot.com/standards/liens/ . Y en a plein d'interessant

W3C Compliant a écrit a écrit :     Regarde le site de mammouthland dans la section "Encore plus"

waw
 
mais ça me dit toujours pas qui c'est sur hfr

C'est Meganne

 
non jtecroispas

W3C Compliant a écrit a écrit : Regarde le site de mammouthland dans la section "Encore plus"

Vi, j'avais vu

--greg-- a écrit a écrit : waw   mais ça me dit toujours pas qui c'est sur hfr

Une forumeuse anonyme ?

vi, une carpe, c ce que je demandais...

Si les boutons officiels du W3C vous sortent par les yeux, vous pouvez voler ceux-là (c'est l'auteur qui le dit !)
http://www.antipixel.com/blog/arch [...] ttons.html

* Le positionnement
 
Tout d'abord, je vous conseille de prendre le temps de lire : http://www.yoyodesign.org/doc/w3c/ [...] ing-scheme
 
Il y a en CSS2, 5 méthodes de positionnement :
 
Le positionnement selon le flux normal
 
Sous ce terme un peu barbare se cache en fait la méthode de positionnement la plus classique. L'ordre d'affichage des éléments suis exactement le même ordre que le document HTML. C'est à dire que :
 
 - les éléments de type "boîte" (<div>, <p>, <h1>, <table>...) s'empilent les uns sur les autres de haut en bas ;
 - les éléments de type "en-ligne" (<span>, <a>, <b>, <img>...) sont placés horizontalement, les uns après les autres le long de la ligne de texte.
 
C'est en fait le mode de positionnement par défaut lorsque aucune valeur n'a été donnée aux attributs "position" et "float".
 
 > Ce mode de positionnement est à privilégier lorsqu'on compose des longs documents mono-colonne comme par exemple les spécifications du W3C données en lien ci-dessus
 
 
Le positionnement relatif
 
Un élément utilise le positionnement relatif lorsqu'il possède la propriété :

 
Le positionnement relatif permet de déplacer un élément relativement à sa position qu'il aurait eu dans le flus normal s'il n'avait pas été déplacé. Pour déplacer l'élément il faut utiliser les propriétés "top", "bottom", "left" et "right".
 
Considérons ce texte hautement philosophique :
 

 
Par défaut tous les mots sont alignés de la même manière sur la ligne de texte. Si maintenant on donne à mon élément <b> les propriétés suivantes :
 

 
Cela va déplacer le texte "PAN !" de 5 pixels vers le haut.
 
Note : on aurait très bien pu écrire "top: -5px", l'effet aurait été identique, mais certains navigateurs n'apprécient pas toujours les valeurs négatives.
 
 > Le positionnement relatif ne s'utilise donc pas de manière générale pour tous les éléments du document mais seulement pour quelques uns d'entre eux pour lesquels on a décidé d'une position particulière.
 
 
Les flottants
 
Un élément est dit "flottant" lorsqu'il possède la propriété :

 
Un élément qui a la propriété "float: right;" sera plaqué contre le bord interne droit de son élément conteneur. Idem pour "float: left;"
 
En des temps reculés de l'histoire du HTML on obtenait un comportement similaire en faisant comme ceci :
 

 
Ceci n'est bien sûr pas à utiliser, l'attribut "align" étant déprécié.
 
Les flottants permettent de faire 2 choses :
 
 - de faire écouler du texte le long des bords du bloc flottant ;
 - de placer des boîtes cote à cote. (rapellons que dans le flux normal celles-ci se placent par défaut les unes sur les autres)
 
Les flottants doivent être utilisés avec précaution car :
 
 - n'importe quel élément qui reçoit la propriété float devient une boîte ;
 - les flottants sortent du flux normal. Concrètement, ceci signifie que si on a quelque chose comme :
 

 
le <div id="principal"> sera considéré comme vide car les 2 <div> qu'il contient ne sont plus dans le flux normal. Pour contourner ce problème on peut placer un troisième dont le but est d'étirer le bloc conteneur :
 

 
La propriété "clear" permet de s'assurer qu'aucun élément n'ira se mettre à gauche ou à droite du <div>.
Cela dit, dans un tel exemple il n'est pas forcément utile de mettre les 2 éléments en flottants. Si on sait d'avance celui qui sera la plus long (et qui imposera sa hauteur au bloc conteneur), on peut le laisser dans le flux normal.
 
 > Les flottants sont donc un bon outil aussi bien pour placer des tableaux ou des illustrations le long des marges internes d'un texte que pour créer une mise en page multi-colonnes.
 
 Attention cependant certains navigateurs ont un peu de mal avec les flottants. C'est par exemple le cas d'Internet Explorer pour Windows qui a tendance avoir des bugs de ce genre :
 
 - http://forum.hardware.fr/forum2.php3?post=27221&cat=10
 - http://www.positioniseverything.net/floatmodel.html
 - http://www.digital-web.com/feature [...] 3-02.shtml
 
 
Le positionnement absolu
 
Un élément utilise le positionnement absolu lorsqu'il possède la propriété :

 
Le positionnement absolu permet de placer précisément, au pixel près, n'importe quel élément dans le document. Comme avec le positionnement relatif, on utilise "top", "bottom", "left" et "right" pour placer l'élément.
Le repère de coordonnées utilisé pour le positionnement est celui du bloc conteneur positionné. J'insiste sur le mot "positionné" car c'est une erreur fréquente. Un élément est positionné lorsqu'il possède la propriété "position" et que celle-ci vaut, "relative", "absolute" ou "fixed".
 
Un exemple pour mieux comprendre. Considérons le code suivant :
 

 
Le bloc "conteneur" n'est pas positionné. Le bloc "contenu" ne va donc pas se positionner par rapport à lui mais par rapport à l'élément racine. Il va donc se retrouver tout en haut à gauche :

   
Si on ajoute à "conteneur" la propriété "position: relative", il devient alors positionné et "contenu" se place par rapport à lui :  

 
Dès qu'un élément est placé absolument :
 
 - il devient un élément de type boîte (bloc) ;
 - il sort du flux normal.
 
 > Le positionnement absolu est l'arme absolue (sans jeu de mots) car on peut se permettre de construire n'importe quel type de mise en page avec, de la plus simple à la plus complexe. Pour les designs simples je conseille toutefois de privilégier les autres formes de positionnement.
 Ce positionnement absolu présente toutefois un risque : celui que l'ordre de lecture des informations à l'écran ne reflète pas celle du document HTML. Etant donné que l'on peut placer les éléments n'importe où, rien n'empêcherait d'écrire dans le document HTML la conclusion d'un texte avant l'introduction et de rétablir l'ordre logique avec le positionnement absolu. Il est toujours bon de se demander comment apparaîtrait une page sans aucun style ou dans un navigateur texte car en terme d'accessibilité c'est un point important.
 
 
Le positionnement fixe
 
Un élément utilise le positionnement fixe lorsqu'il possède la propriété :

 
Le positionnement fixe fonctionne comme le positionnement absolu sauf que l'élément ainsi positionné reste attaché à la zone de visualisation.
 
Concrètement cela empêche les éléments de se déplacer lorsqu'on fait défiler la page avec les barres de défilement.
 
Pour les médias paginés (feuilles de papier, transparent...) l'élément est répété sur toutes lees pages.
 
 > Le positionnement fixe est idéal pour réaliser des menus fixes et donc se passer des frames. Un bon exemple se trouve sur le site du W3C pour les CSS : http://www.w3.org/Style/CSS/
 Gros problème : Internet Explorer pour Windows ne supporte pas ce mode de positionnement, ce qui limite, hélas, considérablement son intérêt.
 
 
Quelques liens pour aller plus loin
- http://www.brainjar.com/css/positioning/
- http://www.blogblues.com/standards/css/position.asp
- http://www.positioniseverything.net/

Voilà, histoire de faire le point sur les questions de positionnement

BRAVO !

BRAVO BIS !!! Enfin un truc simple, illustré Dommage que tu arrives trop tard pour moi, j'ai dû apprendre sur le tas  
 
Sinon, pour le positionnement absolu :
tu dis que le positionnement absolu a un effet pervers, à savoir qu'il dissocie "ordre des éléments à l'écran" et "ordres des éléments dans le code". Certes, c stupide d'écrire les balises la conclusion avant le reste, puis réordonner ça à l'écran avec le positionnement absolu.
Néanmoins, un truc très pratique :
beaucoup de sites présentent, par exemple, un entête (avec un joli logo) suivi d'un menu du site, sur la gauche par exemple. Puis vient le contenu. Or, dans les vieux browsers genre Lynx voire NN4, et aussi dans les moteurs de recherche indexant les premiers paragraphes d'un site, on risque de se retrouver avec un truc genre :
 

 
 
Bref, un tas de trucs de navigation inutiles. Alors qu'en mettant le code html de navigation en fin de document html, puis en le repositionnant de façon absolue en haut de page, le moteur de recherche indexe directement les premiers paragraphes "utiles" (présentation du site, etc.)
 
Donc : ça peut avoir un bon côté.

Exact, j'ai toujours la mauvaise habitude de ne voir que le mauvais coté des choses

RAAAAAAAAAAAAAaaaaaaaaaaaaa ca me saoul mon prof veut rien savoir . C html html et point. J vais m'embrouillé les pédales entre xhtml et le html sniff .

Ben tu lui fais du HTML 4.01 strict (en écrivant les balises en minuscule). Et ensuite, tu grapilles des points en plus en lui montrant que tu sais écrire un !doctype et un prologue <?xml>. Et la touche finale, tu lui ponds une petite CSS qui va bien. T'auras pas moins de la moyenne

Dis lui de venir ici à ton prof, on va lui expliquer des choses...

gm_superstar je t'aime
 
je propose d'effacer mes posts inutiles, de merde, pour nettoyer. si antp veut s'en charger, il a mon autorisation
(histoire de virer les reponses qui vont avec)

Bof, c'est pas très grave les posts autour, ça apporte un peu de vie J'ai fait un sommaire pour accéder directement aux bons commentaires.

en fait tu pourrais tout mettre dans tes premiers posts, y en a 2 quasi vide, et w3c compliant peut virer son post entre tes deux posts vides...

Oui je sais j'avais réservé le 3ème pour ça Le problème est que je n'aime pas trop multiplier les sujets par commentaire (comme dans le deuxième post) parce qu'après on ne s'y retrouve plus beaucoup.
 
Bon on verra quand on en sera à 1000 pages, je me servirai peut-être des premiers commentaires En attendant le sommaire devrait suffire.

J'ai effacé mes qq premiers posts sans grand intérêt

Mais non il fallait les laisser pour les bons sujets que tu vas écrire

Mon cul, c'est TON topic, c'est toi qui t'y colle

Mais non. Et puis t'es pas obligé d'en faire toute une tartine. Des petits topics du genre "trucs & astuces" c'est pas long et ça rend bien service.
 
Je suis sûr que tu appris plein de trucs à développer tes 42 000 versions de pika.net

gm_superstar a écrit a écrit : Mais non. Et puis t'es pas obligé d'en faire toute une tartine. Des petits topics du genre "trucs & astuces" c'est pas long et ça rend bien service.   Je suis sûr que tu appris plein de trucs à développer tes 42 000 versions de pika.net

 
KAUNARD !!!!    
 
Tiens, un truc rigolo : quand tu mélanges des <div> en position static/relative/absolute dans une même page (sans qu'ils soient forcément nestés <--- wow néologisme), t'as NN4 qui l'affiche correctement... jusqu'à ce que tu choisisses de redimensionner la fenêtre Faut faire un refresh une fois la fenêtre redimensionnée, et tout reprend sa place normale.
Par contre si y a que des absolute ou autre, ca passe nickel.

W3C Compliant a écrit a écrit :     KAUNARD !!!!       Tiens, un truc rigolo : quand tu mélanges des <div> en position static/relative/absolute dans une même page (sans qu'ils soient forcément nestés <--- wow néologisme), t'as NN4 qui l'affiche correctement... jusqu'à ce que tu choisisses de redimensionner la fenêtre Faut faire un refresh une fois la fenêtre redimensionnée, et tout reprend sa place normale. Par contre si y a que des absolute ou autre, ca passe nickel.

 
Et en utilisant ça ?
 
<script language="JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape" )&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->
</script>

 
Dommage, Javascript est désactivé.

 
Tu peut toujours le transcrire en VBScript  

FlyMan30 a écrit a écrit :     Tu peut toujours le transcrire en VBScript

 
Je doute que ça marche avec Netscape 4 for Mac