Created
December 1, 2021 21:01
-
-
Save ticituc/2649b34c290c186cd2ffc7d295b2ead8 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Example</title> | |
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" | |
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> | |
<link href="style.css" rel="stylesheet"> | |
</head> | |
<body> | |
<div class="container" style="padding-top: 30px;"> | |
<section class="row divers-head-section"> | |
<h1 class="floating-header">Some very long header here what can cover the image in bellow</h1> | |
<div class="col-12 col-lg-5 left-col"> | |
<div class="bottom-position-wrapper"> | |
<div class="wrapper"> | |
<img src="https://loremflickr.com/400/600" alt="" class="img-fluid"> | |
<div class="accessory"> | |
<p>Some Other content in left lane</p> | |
</div> | |
</div> | |
</div> | |
</div> | |
<div class="col-12 col-lg-6 right-col"> | |
<div class="float-end"> | |
<img src="https://loremflickr.com/300/400" alt="" class="img-fluid"> | |
<p>Some Other content</p> | |
</div> | |
<h3 class="float-start">Lucas ipsum dolor sit amet jade dagobah jade sebulba r2-d2 wookiee gamorrean | |
boba palpatine | |
antilles. Darth gamorrean amidala leia r2-d2 mace. Maul skywalker antilles qui-gonn biggs tatooine | |
antilles. Jade palpatine mustafar ahsoka. </h3> | |
</div> | |
</section> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment