IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

width en % et max width


Sujet :

CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé Avatar de argonath
    Homme Profil pro
    Ingénieur d'Etudes
    Inscrit en
    Juillet 2009
    Messages
    248
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur d'Etudes
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juillet 2009
    Messages : 248
    Par défaut width en % et max width
    bonjour,

    j'ai un site avec une sidebar contenant quelques informations, et une liste de liens présentés sur une image genre post-it.
    Je souhaite avoir un width en pourcentage de 20% de la sidebar pour qu'elle se redimensionne si on réduit la fenêtre, mais préciser un maximum de largeur pour le div des liens.
    En effet mon image, conçue pour faire une mosaïque vers le bas, le fait également vers le coté à partir d'une certaine largeur de définition d'écran.

    voilà les styles css de la sidebar

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
     
    div.sidebar
    {
      background-color:silver;
      float:right;
      width:20%;
      font-size:6pt;
    }
     
    div.sidebar div.side2Titre
    {
      margin-top:1cm;
      max-width:256px;
      background-image:url(bg21.jpg);
      text-align:left;
      padding:0.5cm;
      font-size:8pt;
    }
    div.sidebar div.side2
    {
      max-width:256px;
      margin-top:0cm;
      background-image:url(bg22.jpg);
      text-align:left;
      padding:0.5cm;
      font-size:8pt;
    }
    div.side2Titre est le haut de l'image, sur lequel il y'a juste un intitulé, et div.side2 porte l'image prévue pour se "dérouler" vers le bas, sur laquelle seront écrits tous les liens.

    malgré les max-width rien ne change, si le lien est long, l'image va se dupliquer sur le coté également

  2. #2
    Membre expérimenté
    Avatar de tzilliox
    Homme Profil pro
    Développeur Web
    Inscrit en
    Avril 2007
    Messages
    153
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 39
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Avril 2007
    Messages : 153
    Par défaut
    Salut argonath !

    Personnelement j'ai pas réussi à comprendre la cinématique de ton site.
    Aurais-tu un lien vers ton site ? un screenshot ? Peux-tu mentionner sous quel navigateur tu as testé ?

    Bonne journée,
    Thomas.

  3. #3
    Membre chevronné
    Profil pro
    Chef Gérant
    Inscrit en
    Octobre 2005
    Messages
    230
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations professionnelles :
    Activité : Chef Gérant
    Secteur : Santé

    Informations forums :
    Inscription : Octobre 2005
    Messages : 230
    Par défaut
    bonjour,

    Peut-etre devrait-tu appliquer le max-width sur le conteneur parent (div.sidebar) .
    Un min-width peut aussi etre utile sur le conteneur global de la page.

    Ou s'il ne s'agit que d'un probleme d'image de fond , le background-repeat: (repeat-y,repeat-x,no-repeat) est aussi autre une solution .


    GC

  4. #4
    Membre éclairé Avatar de argonath
    Homme Profil pro
    Ingénieur d'Etudes
    Inscrit en
    Juillet 2009
    Messages
    248
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Ingénieur d'Etudes
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juillet 2009
    Messages : 248
    Par défaut
    Non, pas uniquement un problème d'image, c'est quand le texte "dépasse" qu'elle se dédouble, donc au contraire, si je parviens à limiter (limite haute ) la taille du texte tout en laissant un % comme règle générale, c'est gagné ^^

    Je vais essayer tes solutions, malheureusement comme je n'ai pas une telle définition d'écran (>2180 c'est pas commun quand même ^^ ) je n'ai qu'une personne qui peut me dire si celà marche ou pas à chaque fois.

    si je n'arrives à rien, je remettrais ici un screen dans les deux cas pour montrer exactement ce que je voudrais et ce qui cloche ^^

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [CSS2 ] utilisation conjugé max-width + min-width
    Par zargeus dans le forum Mise en page CSS
    Réponses: 5
    Dernier message: 07/12/2006, 16h59
  2. Réponses: 2
    Dernier message: 29/08/2006, 16h18
  3. Max-width dans une image sous IE?
    Par Death83 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 9
    Dernier message: 23/12/2005, 02h04
  4. Emuler un min/max-width ou un min/max-height
    Par Perceval dans le forum Balisage (X)HTML et validation W3C
    Réponses: 5
    Dernier message: 18/09/2005, 18h43
  5. internet explorer et max-width
    Par Death83 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 13/08/2005, 23h50

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo