28112 sujets

CSS et mise en forme, CSS3

Bonjour, j'aimerais pouvoir mettre une photo que j'ai mis dans une balise aside sur la droite de mon texte écrit dans une balise article. Je le fais avec flexbox, mais si ce n'est pas possible avec je suis preneur d'autres solutions. voici mon code :

<html>
    <head>
		<link rel="stylesheet" href="css Paul Baran.css" />
        <meta charset="utf-8" />
        <title>Paul Baran</title>
    </head>

    <body>
		<header>
			<h1><U>Paul Baran</U></h1>
			<h2> Le père fondateur d'internet</h2>
		</header>

		<section>
			<article>
				<p>Paul Baran naît le 29 avril 1926 à Grodno en Pologne et se voit considéré comme ’un des pères fondateurs d’Internet, inspirateur d’ARPANET, et avant tout en tant que visionnaire qui, depuis le début des années 1960, a imaginé les schémas de l’architecture réseautique restant valables encore aujourd’hui.<br/>
				Il imagine un réseau de communication dit distribuéqui utilise des technologies numériques sans centralisation de l'information et sans ligne de transmission dédiée. Dans ce système, les messageset les unités de données informatiques sont fragmentés en « blocs de données », ou « paquets », avant d'être acheminés successivement vers l'adresse de destination, où ils seront réassemblés.<br/>
				De 1960 à 1962, la Rand Corporation publie une série d'études rendant compte des travaux de Baran sur la transmission par paquets.</p>
				<p>En 1968, Baran quitte la Rand Corporation pour devenir l'éminence grise de la D.A.R.P.A. (Defense Advanced Research Projects Agency, l'agence du ministère de la Défense américain pour les projets de recherche avancée), où il œuvre à la mise au point du réseau de communication à haute vitesse Arpanet, précurseur d'Internet. Paul Baran fondera ensuite plusieurs entreprises.</p>
				<p class="conclusion"> Ingénieur électricien américain, Paul Baran a ainsi inventé le concept de réseau distribué et, parallèlement aux travaux de l'informaticien britannique Donald Davies, la transmission de données par paquets. Ces inventionsont fourni les bases d'Internet.</p>
			</article>
			<aside>
				<figure>
					<img src="images/Paul_Baran.jpg" alt="Photo de Paul Baran" />
					<figcaption><U>Photo De MR. Paul Baran</U></figcaption>
				</figure>
			</aside>
		</section>
		
		<nav>
			<p> <a href="Page principale.html" title="Menu">pour revenir au menu cliquez ici</a><p>
		</nav>
	</body>
</html>



.conclusion
{
	color: gray;
 
}
h1
{
	color: green;
	
}
body
{
	background: rgb(211,211,211);
	
}

a:hover
{
	font-style: italic;
	color: yellow;
	
}
a:active 
{
    background-color: rgb(98,0,206);
}
article
{
	border: 3px rgb(174,102,255) outset;
	text-align: justify;
	max-width: 825px;
	min-width: 200px;
	padding: 5px;
	margin: 20px;
}
section /*flexbox*/
{
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	flex-wrap: wrap;
}
aside /*flexbox*/
{
	align-self: flex-end;
}
Administrateur
Hello,

Il faut supprimer le "flex-direction: column;". C'est à cause de cette déclaration que les contenus s'affichent... en colonne (les uns sous les autres) et non les uns à côté des autres.
Raphael a écrit :
Hello,

Il faut supprimer le "flex-direction: column;". C'est à cause de cette déclaration que les contenus s'affichent... en colonne (les uns sous les autres) et non les uns à côté des autres.


D'accord, merci beaucoup !