Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <title>Bootstrap Example</title>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
- <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
- <style>
- .price,.pricenm{
- display: block;
- }
- .tri{
- background: #f1f1f1;
- }
- .dva{
- padding: 20px;
- }
- .price,.pricenm{
- text-align: center;
- }
- .price{
- padding-top: 30px;
- font-size: 0.8rem;
- font-weight: 700;
- }
- .pricenm{
- font-size: 2rem;
- font-weight: 700;
- margin-top: -10px;
- }
- p{
- margin: 0;
- }
- .row{
- border: 5px solid #f1f1f1;
- margin-bottom: 20px;
- }
- .jedan{
- background: #cecece;
- text-align: center;
- }
- .krug{
- width: 50px;
- height: 50px;
- background: #fff;
- border-radius: 50%;
- margin: 25px auto;
- }
- @media (max-width: 625px){
- .dva{
- text-align: center;
- }
- }
- </style>
- </head>
- <body>
- <div class="container">
- <div class="row">
- <div class="col-md-2 jedan">
- <div class="krug"></div>
- </div>
- <div class="col-md-8 dva">
- <h3>PAKET SIMPLE</h3>
- <p>// Ovo je test rečenica</p>
- </div>
- <div class="col-md-2 tri">
- <span class="price">CIJENA</span>
- <span class="pricenm">120 KM</span>
- </div>
- </div>
- <div class="row">
- <div class="col-md-2 jedan">
- <div class="krug"></div>
- </div>
- <div class="col-md-8 dva">
- <h3>PAKET PROJECT X</h3>
- <p>// Ovo je test rečenica</p>
- </div>
- <div class="col-md-2 tri">
- <span class="price">CIJENA</span>
- <span class="pricenm">540 KM</span>
- </div>
- </div>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement