dimensionner des blocs en %

noid · Message par **noid** » 14 févr. 2008, 17:23

Bonjour,
tout est dans le titre,
est-il possible de dimensionner les blocs header, menu, bloc texte, etc... en %,
pour construire un modèle de page avec kompozer,
Merci pour votre aide.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr-FR; rv:1.8.1.11) Gecko/20071128 Iceweasel/2.0.0.11 (Debian-2.0.0.11-1)

Message par **Ymai** » 14 févr. 2008, 17:25

Bonjour
La réponse est "oui".

Pour une réponse plus précise, quelques informations supplémentaires seraient bienvenues.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.12) Gecko/20080208 Fedora/2.0.0.12-1.fc8 Firefox/2.0.0.12

noid · Message par **noid** » 14 févr. 2008, 17:30

Ah, c'est une bonne nouvelle,
Que souhaitez-vous comme infos complémentaires ?

Comment accéder à ce type de dimensionnement ?
Faut-il modifier qq chose dans komposer ?

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr-FR; rv:1.8.1.11) Gecko/20071128 Iceweasel/2.0.0.11 (Debian-2.0.0.11-1)

noid · Message par **noid** » 14 févr. 2008, 20:30

J'ai cherché la solution,
sûrement mal,
car je n'ai pas trouvé le truc pour dimensionner en %
Si une âme charitable pouvait m'indiquer la démarche.....

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr-FR; rv:1.8.1.11) Gecko/20071128 Iceweasel/2.0.0.11 (Debian-2.0.0.11-1)

Fabrice.Tres.Net · Message par **Fabrice.Tres.Net** » 14 févr. 2008, 21:57

par exemple :

width: 50% ;

au lieu de width:300px;

Invité · Message par **Invité** » 15 févr. 2008, 07:59

OK oui,
Mais bon, il y a un truc qui m'échappe,
si je définis un bloc header
height 25% et width 100% fond jaune par exemple,
le header que j'obtiens, c'est une bande jaune de 9px de haut sur toute la largeur,
ça ne fait pas 25% de height.
je ne pige pas pourquoi

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr-FR; rv:1.8.1.11) Gecko/20071128 Iceweasel/2.0.0.11 (Debian-2.0.0.11-1)

Message par **Ymai** » 15 févr. 2008, 08:56

Bonjour
Je crois que le problème provient du fait que le bloc "parent" du header (qui n'est autre que "body") n'a pas de hauteur définie.
Donc, 25% de quoi???

Expérience:

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>test</title>
</head>
<body style="height: 300px;">
    <div style="background-color: yellow; width: 80%; height: 50%;">
    </div>
</body>
</html>

"body" est défini à 300px de haut et contient bloc dont la hauteur est définie à 50%... de son parent. Ca marche.
Quelqu'un peut confirmer pour IE?

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.12) Gecko/20080208 Fedora/2.0.0.12-1.fc8 Firefox/2.0.0.12

Message par **chinon37** » 15 févr. 2008, 09:14

Bien que je répugne à utiliser ce navigateur exotique, je viens de faire le test et confirme la brillante démonstration de Ymai pour IE6.

Message par **Ymai** » 15 févr. 2008, 09:17

Je ne suis jamais arrivé à le réinstaller...

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.12) Gecko/20080208 Fedora/2.0.0.12-1.fc8 Firefox/2.0.0.12

Message par **chinon37** » 15 févr. 2008, 09:27

Ymai a écrit :Je ne suis jamais arrivé à le réinstaller...

pfffouou! de toute façon, sous linux ce serait illégal selon leur licence! et les extensions IE tab et IEview sont réservées à windows...

Fabrice.Tres.Net · Message par **Fabrice.Tres.Net** » 15 févr. 2008, 10:50

Ymai a écrit :Je ne suis jamais arrivé à le réinstaller...

Pourquoi le réinstaller et polluer sa machine quand tu peux avoir une simulation en ligne de tous ces pseudo-navigateurs avec http://browsershots.org/

Mongo Bob · Message par **Mongo Bob** » 15 févr. 2008, 18:19

Fabrice.Tres.Net a écrit :une simulation en ligne de tous ces pseudo-navigateurs avec http://browsershots.org/

Il ne fonctionne pas bien à 100%, loin de là, je l'ai abandonné car il me refuse mes cop d'éc même quand je clique sur "étendre". Il faut attendre des heures et ta demande expire au bout de 30' et il faut repenser à revenir toutes les 30' avant l'échéance pour faire "étendre", tu penses à autre chose et hop! ta demande a expiré ou elle n'a jamais été envoyée et il faut recommencer... Je pense que ça repose entre les mains de bénévoles qui n'ont pas vraiment le temps de s'en occuper.
C'était trop beau, quantité de systèmes et de navigs proposés et gratuit -et même trop, d'ailleurs, suffirait d'avoir les principaux moteurs- dommage...

Invité · Message par **Invité** » 16 févr. 2008, 16:56

Oui, en effet,
j'essaie de bidouiller une simple page avec 3 blocs :
un header, un bloc-menu à gauche et un bloc-texte à droite,
avec 3 couleurs de fond différentes
en utilisant une feuille css liée,

un truc basique hyper simple pour voir comment komposer fonctionne,
et pour le moment, mes essais ne sont guère concluants.

La "prise en mains" de komposer ne semble pas aussi évidente qu'on pourrait le croire,

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr-FR; rv:1.8.1.11) Gecko/20071128 Iceweasel/2.0.0.11 (Debian-2.0.0.11-1)

Message par **Ymai** » 16 févr. 2008, 17:01

Et en bidouillant sur la base de
http://css.alsacreations.com/Modeles-de ... age-en-CSS ?

Invité · Message par **Invité** » 16 févr. 2008, 18:33

Merci pour vos réponses.

J"ai réussi à construire ma page,

J'ai défini mes règles css :

Code : Tout sélectionner

/* Generated by KompoZer */
* {
  border-width: 0px;
  margin: 0%;
  padding: 0%;
}
body {
  border-width: 0px;
  margin: 0%;
  padding: 0%;
  height: 100%;
  width: 100%;
  position: absolute;
}
#header {
  border-width: 0px;
  margin: 0%;
  padding: 0%;
  background-color: yellow;
  display: block;
  width: auto;
  height: 25%;
}
#menu {
  border-width: 0px;
  margin: 0%;
  padding: 0%;
  background-color: green;
  width: 20%;
  height: 75%;
  position: absolute;
  display: block;
}

Donc, une construction on ne peut plus simple.

Dans komposer,une fois le fichier css établi comme ci-dessus,
je construis la page html comme ceci :
Corps de texte > conteneur générique > un div apparait en bas dans la barre d'état,
on clique dessus et on sélectionne id puis header,
pas de problème, le header s'affiche bien jaune, avec un height de 25%
à condition que l'on mette body en position absolue ou fixe.
Quel est le meilleur choix ? absolue ou fixe.

Ensuite, pour continuer ma page html, je bloque,
Corps de texte > conteneur générique > ?????
Qqu'un peut-il me tuyauter
Merci

Car, ne réussissant pas à poursuivre ainsi,
j'ai cliqué sur source et taper mes 2 div menu et bloc-texte à la main.

C'est sûrement, un truc très simple,
mais on est tout con quand on ne trouve pas !!!!

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr-FR; rv:1.8.1.11) Gecko/20071128 Iceweasel/2.0.0.11 (Debian-2.0.0.11-1)

Geckozone

dimensionner des blocs en %

dimensionner des blocs en %

Qui est en ligne ?