Compréhension de float

Version imprimable

Bonjour, me revoici :oops:

J'ai un nouveau problème avec un float ; à peu près inverse du précédent.

Voici mes données

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 <div class='affichage'>
        <div style='text-align:center'><a href='accueil1.php?frd=presentation1&lang=fr'><img src='../img/logo_droite.jpg'></a></div><div class='droite'><div class='center'>
        <form action='login.php' method='post' name='connect'>
                        <table class='center'>
                        <tr><td colspan='2'>
                                <tr><td align='right'>Identifiant&nbsp;<td><input name='login' type='text' id='login' class='cssinput' size='12'>
                                <tr><td align='right'>Mot de passe&nbsp;<td><input name='pass' type='password' id='pass' class='cssinput' size='12'>
                                <tr><td colspan='2'>
                                <tr><td><td><input type='image' name='Submit' src='../img/go.gif'>
                                <tr><td colspan='2'>
                                <tr><td colspan='2' align='center'><a class='acc' href='req_login.php?new_change=new'>S'incrire</a>
                                 | <a class='acc' href='activ.php'>Adhérer</a>
                                 <tr><td colspan='2' align='center'><a class='acc' href='forgotten.php'>Mot de passe oublié</a>
        </table></form>
</div><table class='center'><tr><td><a href='accueil1.php?frd=articles_themes&lang=fr'>Articles par thèmes</a>
    <br><a href='accueil1.php?frd=articles_recents&lang=fr'>Articles récents</a></table></div><div class='article'><h2>Dernière mise à jour</h2><h5>Blabla</h5>
    </div>

Et sur CodePen : http://codepen.io/anon/pen/ohive

Je voudrais savoir s'il est possible d'éviter que la bordure inférieure du bloc 'article' empiète sur le float 'droite'. Ou d'obtenir ce résultat avec une autre méthode.

Bonne soirée.

JD

08/08/2013, 05h05
Muchos

En mettant un background à la boîte en question ?

Code:

.droite { background: #CCCC99; }

PS: pardon, mais votre code html est moche. :( Cela rend difficile la mise en page et la maintenance, entre autres.
08/08/2013, 08h34
jd_83

Oui, ça marche.

Au cas où il y aurait encore des trucs à apprendre sur ce thème, je ne mets pas "résolu" tout de suite.

Merci à vous et bonne journée.

JD
08/08/2013, 10h11
Invité
Bonjour,

Citation:

Envoyé par Muchos

...pardon, mais votre code html est moche. :( Cela rend difficile la mise en page et la maintenance, entre autres.

Tant que tu écriras un code plein d'erreurs de conception (avec des balises obsolètes, <table> mal employées,...), tu auras toujours des problèmes.

Tu as tout intérêt à reprendre les bases :
Et plus généralement :
- Les meilleurs cours et tutoriels (X)HTML
- Les meilleurs cours et tutoriels CSS
08/08/2013, 11h33
rodolphebrd

@Muchos et @jreaux62 +1

Merci de présenter un code mieux indenter afin d'en faciliter la lecture pour les membres qui vous aident.
08/08/2013, 21h10
jd_83

Merci ; je vais tenter de suivre vos conseils
:?