Bootstrap Snippet info card using HTML CSS

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
<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 ---------->
  <script src="//cdn.shopify.com/s/files/1/0028/6132/t/4/assets/jquery-min.js?15684938142982497657"></script>
  
<script src="//cdn.shopify.com/s/files/1/0028/6132/t/4/assets/breakpoints-min.js?15684938142982497657?v=1.2"></script>
  <script src="//cdn.shopify.com/s/files/1/0028/6132/t/4/assets/plugins-min.js?15684938142982497657?v=1.2"></script>
  <script src="//cdn.shopify.com/s/files/1/0028/6132/t/4/assets/scripts-min.js?15684938142982497657?v=1.2"></script>
  <!-- Liquid Shop JS -->
<div class='divider'></div>
  <div id='anatomy'>
  <div class='wrapper collapse-small'>
    <div class='anatomy-title mast-with-stroke'>
      <h2 class='center'>
        <span>Jean Anatomy</span>
      </h2>
    </div>
  </div>
  <div class='anatomy-inner'>
    <div class='anatomy-contain'>
      <a class='anatomy-hover no-ajax' data-hover='patch' href='#' title='Patch'>
        <span class='icon'>
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 371.2 371.2" enable-background="new 0 0 371.2 371.2"><path d="M371.2 160.2H211V0h-50.8v160.2H0V211h160.2v160.2H211V211h160.2z"/></svg>
        </span>
      </a>
      <a class='anatomy-hover no-ajax' data-hover='denim' href='#' title='Denim'>
        <span class='icon'>
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 371.2 371.2" enable-background="new 0 0 371.2 371.2"><path d="M371.2 160.2H211V0h-50.8v160.2H0V211h160.2v160.2H211V211h160.2z"/></svg>
        </span>
      </a>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

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
.maintenance .site-nav, .maintenance .link-to-nav, .maintenance .link-to-cart, .maintenance .mobile-nav, .maintenance .footer-links:first-of-type, .maintenance .footer-right {
    display: none !important;
}
.error-404 {
    padding-bottom: 4rem;
    padding-top: 4rem;
}
@media screen and (min-width: 768px) {
.error-404 {
    padding-bottom: 10rem;
    padding-top: 10rem;
}
}
.error-404 h1 {
    margin-bottom: 1rem;
}
.error-404 p {
    margin-bottom: 1.5rem;
}
.error-404 .button {
    margin: 0 auto;
}
#fit-guide {
    margin-top: -2rem;
    padding-top: 2rem;
}
#fit-guide .fit-title {
    margin-bottom: -1rem;
}
#fit-guide .fit-title span {
    background: #fff none repeat scroll 0 0;
    display: table;
    margin: 0 auto;
    padding: 0 1rem;
    position: relative;
    z-index: 2;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"info card"
Bootstrap 3.0.0 Snippet by evarevirus

Related: See More

Questions / Comments:

"info card" Bootstrap 3.0.0 Snippet by evarevirus

Related: See More

Questions / Comments:

"info card"
Bootstrap 3.0.0 Snippet by evarevirus