"Responsive Content Box"
Bootstrap 3.0.0 Snippet by CAMPCarlosMulul23

Post to Facebook Tweet this

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <body> <div class="container"> <div class="row"> <div class="col-md-12"> <div class="contenedor"> <div class="circulo"> <h1>1</h1> </div> <h1>iWebs</h1> <h2>Designer + Developer</h2> <h2>by Carlos Mulul</h2> </div> </div> </div> </div> </body>
body{ background-color: #ebebeb; } .contenedor{ height: 20em; width: 65em; position: relative; margin: 1em auto; padding: 2em; background: #fff; } .circulo{ height: 8em; width: 8em; position: absolute; border-radius: 50%; top: 50%; left: -4em; margin-top: -4em; } .circulo{ box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2), 1px 1px #000; background-color:#875a39; } h1 { margin: 0; color: #262626; font-family: 'Avenir Next', Helvetica, Arial, sans-serif; font-size: 3em; font-weight: 100; text-align: center; text-shadow: 0 1px #fff; } h2 { margin: 0; color: #666; font-family: 'Avenir Next', Helvetica, Arial, sans-serif; font-size: 1em; font-weight: 700; letter-spacing: 0.125em; text-align: center; text-shadow: 0 1px #fff; text-transform: uppercase; }

Related: See More

Rubik Presentation Page
Responsive Invoice template
Responsive Data Cards (Bootstrap 4)
Content + Sidebar BS4

Questions / Comments: