-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathfloatAndOverflow.html
74 lines (66 loc) · 3.74 KB
/
floatAndOverflow.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Float And Overflow</title>
<style>
img {
float: right;
}
#para {
clear: right;
}
.card {
width: 300px;
height: 300px;
border: 2px solid cadetblue;
overflow: auto;
}
#para2{
color: rgb(255, 1, 1);
}
</style>
</head>
<body>
<div class="container">
<img src="assets/developer.png" alt="Developer Photo">
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Cum accusamus numquam iste, earum,
explicabo illo
repellendus modi enim quaerat veniam vel quia totam qui vitae corporis delectus possimus in impedit. Quod
recusandae, illo quo explicabo blanditiis, dicta dolor itaque aliquid ad unde corporis a? Possimus facilis
porro
tempora quasi. Molestias deleniti enim blanditiis quos placeat delectus aperiam natus impedit non ipsum ab
minus
voluptate harum odio labore ullam, velit hic asperiores quae officiis quia. Cumque commodi nemo ad est nisi,
aliquam minima neque ea voluptatum hic, saepe vel molestiae, labore quasi necessitatibus aliquid harum
doloribus
fugit iure officia eligendi perspiciatis.
</p>
<p id="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptates aliquid, eum ad vero natus
consequuntur
deleniti beatae et totam, officia ipsum accusamus nostrum omnis pariatur obcaecati amet dolorem unde commodi
excepturi sapiente tempora inventore. Ullam, nemo similique placeat, id ut error, eum excepturi quae et
dicta dolore totam hic doloremque?</p>
</div>
<div class="card">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Labore provident inventore quo nostrum repellendus
optio ipsam necessitatibus, sint tenetur nihil laboriosam natus corrupti saepe autem quod laborum, ea
voluptatem quibusdam ex quia, corporis temporibus! Nihil architecto mollitia numquam autem aut tenetur
saepe. Animi doloribus minima dignissimos cum quo reiciendis labore beatae nesciunt magni voluptas sed
commodi molestias aspernatur vero, repellat nihil numquam ea. Ex fugit commodi eligendi quam magni assumenda
quis vel veniam nemo aperiam dicta, quaerat dignissimos nobis eos at placeat quas corporis aut laudantium
esse doloribus blanditiis cum dolore et? Repellendus dolor laborum quam totam amet perspiciatis cupiditate
eum in porro mollitia natus aliquid, nobis incidunt vitae culpa, possimus, deleniti eligendi maxime
nesciunt? Maxime cumque sint nobis natus?</p>
</div>
<p id="para2">Lorem ipsum dolor sit amet consectetur adipisicing elit. Nihil provident maiores cupiditate assumenda eum
reprehenderit eos aut fugit, vitae id quisquam. Tenetur cumque necessitatibus iure ducimus similique sunt
eveniet commodi vel quo, nisi in iusto molestias, nostrum aliquam, consequuntur odit sed? Velit dolorum
laudantium iusto veritatis, dolores nostrum quasi obcaecati quo tempore consequuntur ipsam delectus atque hic
dignissimos porro maiores doloribus at aspernatur eveniet dolore aperiam. Incidunt nemo itaque recusandae
suscipit modi doloremque hic perspiciatis molestias, est debitis enim doloribus tempora asperiores nesciunt ex
neque quo officiis reprehenderit veritatis expedita culpa. Accusantium voluptatibus eveniet exercitationem nobis
officia, quibusdam ipsa pariatur?</p>
</body>
</html>