Bonjour à tous
J'étudie actuellement le html et css.
Pour mon projet à l'école je dois positionner deux <div> côte à côte . Une image à côté d'un texte réparti en 3 colonnes .
J'ai vu avec mon prof pour le HTML il m'a dit que la structure était correct . Cependant je n'arrive pas du tout à placer cette image à côté de mon texte.
Si vous pouviez me donner un coup de main car la je sèche complètement.
J'étudie actuellement le html et css.
Pour mon projet à l'école je dois positionner deux <div> côte à côte . Une image à côté d'un texte réparti en 3 colonnes .
J'ai vu avec mon prof pour le HTML il m'a dit que la structure était correct . Cependant je n'arrive pas du tout à placer cette image à côté de mon texte.
Si vous pouviez me donner un coup de main car la je sèche complètement.
<section id ="nos-services">
<div class="head">
<h1 class="titre-services"> Nos services </h1>
<div class="trait"> <div class="circle"><i class="fas fa-circle"></i></div></div>
<p class="description"> Nous nous adaptons à chacuns de vos projets afin qu'ils soient uniques,esthétiques et performants.
</p>
</div>
<aside>
<img src="images/pic_pc.png"" alt="photo de pc" />
</aside>
<ul id="contenu">
<li>
<h2><div class="cercle"><span><i class="fas fa-chart-line"></i></span></div> UX Design</h2>
<p>Amélioration de l'expérience utilisateur par l'anticipation des attentes et des besoins de chacuns.</p>
</li>
<li>
<h2><div class="cercle"><span><i class="fas fa-chart-pie"></i></span></div> UI Design</h2>
<p>Expérience de navigation la plus intuitive possible via un design fonctionnel...</p>
</li>
<li>
<h2><div class="cercle"><span><i class="fas fa-cubes"></i></span></div> SEO</h2>
<p>Augmentation de la visibilité et de la qualité de votre site internet au sein des moteurs de recherche via le référencement naturel. </p>
</li>
</ul>
</div>
</section>
.titre-services
{
text-align: center;
font-family:'robotoblack', arial ,sans-serif;
font-size: 40px;
margin-top: 5px;
color:#282828;
padding-top: -1px;
}
.description
{
font-family: 'robotoregular', arial ,sans-serif;
font-size: 14px;
padding-top: 20px;
color: #6f7a81;
}
.head
{
position: relative;
text-align:center;
font-size:2em;
border:1px solid black;
}
h2
{
margin-left:15px;
padding-top: 15px;
}
li p
{
margin-left: 15px;
color: #6f7a81;
font-family: 'robotoregular', arial ,sans-serif;
font-size: 14px;
}
#contenu
{
display: flex;
flex-direction: column;
list-style: none;
margin-left:50%;
margin-bottom: 200px;
}
aside
{
width:500px;
}
aside img /* Image de PC */
{
padding-top: 15px;
}