Hjälp med CSS och placering av text och bild
Hej allihopa. Jag har sökt runt lite på nätet för att klura ut detta, och så långt jag kommit så har jag luskat ut att man ska göra float:right/left på sina bilder i CSS. När jag gör det blir allt käpprätt åt helvete rent ut sagt. Och det är nu jag har fastnat och vet inte hur jag ska ta mig längre.
Så här ser min bild ut när jag gjorde float left och right på mina bilder
https://i.imgur.com/GW6GhtH.jpg
och det är så här jag vill att det ska se ut (ungefärligt, måste inte vara rosa ramar runt osv)
https://i.imgur.com/gs6d7fY.jpg
Men jag skulle gärna vilja ha bilderna på samma sätt som det är på exempel bilden. Så om någon skulle kunna hjälpa mig med det vore jag förevigt tacksam.
HTML koden
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content=width=device-width">
<meta name=" description" content="John doe CV">
<meta name="keywords" content="John Doe. Jobb applikation">
<meta name="author" content="John Doe">
<title>John Doe</title>
<link rel="stylesheet" type="text/css" href="./Css2/css2.css">
</head>
<body>
<header>
<div class="container">
<div id="branding">
<h1>John Doe</h1>
</div>
<nav>
<ul>
<li class="current"><a href="CV2.html">CV</a></li>
</ul>
</nav>
</div>
</header>
<section id="showcase">
<div class="container">
<div>
<p>
<h2><b>Om mig</b></h2>
<img src="./bild/CV bild.jpeg" class="CV"/>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam pharetra feugiat metus quis ultricies. Nulla pretium vulputate dui eget suscipit. Quisque a est sem, sed sagittis ante. Etiam a nulla a risus
</p>
</div>
<div>
<img src="./bild/bank.jpg" class="bank"/>
<h3><b>Utbildning och erfarenhet</b></h3>
</div>
<ul>
<li>Glad</li>
<li>Positiv</li>
<li>Ödmjuk</li>
<li>Trevlig</li>
<li>Målinriktad</li></span>
</ul>
</div>
</section>
<section id="boxes">
<div class="container">
<div class="box">
</div>
</section>
och CSS koden
body {
font-family: arial, helvetica, sans-serif;
font-size:15px;
line-height:1.5;
padding: 0px;
margin: 0px;
background-color:#f4f4f4
}
/* global */
.container{
width: 80%;
margin:auto;
overflow:hidden;
}
/* header **/
header{
padding-top:30px;
min-height:70px;
}
header{
border-bottom:#e8491d 3px solid;
}
h1{ color:blue;
text-align: center;
}
.bank {
float:left;padding:10px;
}
.CV {
float:right;
padding:10px;
}
