5592 sujets

Sémantique web et HTML

Bonjour,

Pour avoir deux DIVs côte à côte, j'ai mis les codes suivants dans la balise "body".
Apparemment, cela fonctionne avec mes navigateurs du PC.
Mais, je ne sais pas si ces codes sont corrects et s'ils sont adaptés pour les petits écrans des smartphones.
Merci de me renseigner.

Bien cordialement,

Je suis parti du principe suivant:

<div>
   <div></div>
   <div></div>
</div>


Et voici mes codes:

<div>
   <div style="float:right">
	   <table>
		   <tr>
			   <td class="style250">&nbsp;</td>
			   <td class="style259">&nbsp;</td>
			   <td class="style259">&nbsp;</td>
			   <td class="style259">&nbsp;</td>
			   <td>
			   <img src="mg/mg1/b100x140.jpg" style="float: right" alt="image100" class="style259"></td>
			   <td></td>
			   <td class="style259">&nbsp;</td>
		   </tr>
	   </table>
	</div>
   <div>
				<table>
					<tr>
						<td><span class="style259">C'est un exemple</span><br class="style259"/>
						<span class="style259">2 juin 2025</span></td>
					</tr>
				</table>
	</div>
   <div style="float:left;">
</div>
</div>


Modifié par AM250 (04 Jun 2025 - 22:01)
Bonjour, ce sont d'ancienne technique qui n'ont plus lieu d'être actuellement vu les possibilités de CSS.
On n'utilise plus les tableaux pour de la mise en page et float sert uniquement à faire couler du texte autour d'un élément. Renseignez vous sur Flexbox et Grid en CSS.
Pour Flexbox :
https://la-cascade.io/articles/flexbox-guide-complet
https://developer.mozilla.org/fr/docs/Web/CSS/CSS_flexible_box_layout/Basic_concepts_of_flexbox
https://www.alsacreations.com/tuto/lire/1493-CSS3FlexboxLayoutmodule.html
https://www.alsacreations.com/article/lire/1794-flexbox-ou-grid-layout.html
Et un jeu pour apprendre https://flexboxfroggy.com/#fr

Pour avoir deux parties l'une à coté de l'autre :

    <div class="flex">
        <div class="item">1</div>
        <div class="item">2</div>
    </div>

Avec ce CSS :

        .flex {
            display: flex;
        }
@casper2

Bonjour,
Je vous remercie pour votre aide. Je vais consulter les liens.
Bien cordialement,
Modifié par AM250 (05 Jun 2025 - 16:30)