28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai passé 4 heures à essayer de mettre un texte (dans un div) à droite d'un block (div taille définir + float).
Je l'ai fait (voir code ci-dessous) mais quand je réduis la taille de l'écran, le block de droite passe sous le block de gauche.
Pouvez-vous m'aider svp?
Merci,
Pierre

CSS:
.boxtitre_inc{ 
width: 310px; 
height: 900px; 
overflow: hidden; 
float: left;  
}
.box_inc{ 
width: auto; 
height: auto; }

HTML:
<div class="boxtitre_inc">Le block fixe ici </div>
<div class="box_inc">Block à droite avec le texte. S'adapte à l'écran</div>


Modifié par soriro (20 Aug 2016 - 16:59)
Bonsoir !

Je ne vois rien qui m'étonne dans votre code : tant que le bloc de droite peut rester à droite, il le fait. Quand il n'a plus la place, il passe en dessous. Je précise que je regarde depuis un ordinateur de bureau sur Mozilla Firefox.

Smiley smile
Il faut tout lire svp... Justement, je souhaite que le bloc de droite ne passe pas sous le bloc de gauche qd on réduit la taille de la page (ce qui se passe avec le script présenté).
Merci
Oui, mais que peut faire le bloc de droite ?

A part utiliser les media queries et décider qu'à partir d'une certaine largeur d'écran, le bloc de gauche doit cesser d'avoir une largeur fixe et laisser de la place au bloc de droite...

Mais c'est délicat de trop étroitiser des blocs pour la lisibilité du texte.

Smiley smile
Ce que je souhaiterai: le bloc de droite passe en dessous du bloc de gauche (mais pas en dessous) à mesure qu'il n'y a plus de place dedans.
Merci
soriro a écrit :
...le bloc de droite passe en dessous du bloc de gauche (mais pas en dessous) à mesure qu'il n'y a plus de place dedans.
Merci

le bloc de droite passe en sous (plus bas) du bloc de gauche (mais pas derrière) à mesure qu'il n'y a plus de place dedans.
Je viens de comprendre que se sont mes puces (Li et ul) qui passent en arrière plan du block de gauche.
Ce problème est connu les puces dans blocks flottant ne sont pas prises en compte: c'est comme si elles n'existaient pas. Est-ce que vous savez comment on peut régler ce problème sans rendre le block non ajustable?
Merci,

Pierre
Après une journée de recherche, j'ai renoncé.
Les puces d'un block flottant ne sont pas gérées et essayé les marges, j'ai essayé de paramétrer les propriété des li et ul sans régler le problème.
J'ai donc arrêté mes recherches.