Bootstrap Snippet Feed tiles [ Bootstrap 4] using HTML CSS Bootstrap

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="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.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 ---------->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    <h1>Maybe first commit on Bootstrap v4</h1>
    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top img-responsive" src="http://expertik.ewolutions.cz/data.jpg" alt="Card image cap">
            <div class="card-img-overlay" style="height:180px;">
                <img class="img-circle img-thumbnail" src="https://minotar.net/avatar/Ewwe" width="64" height="64" alt="Avatar">
                <span class="label label-default"  data-toggle="tooltip" data-placement="top" title="Tooltip on top"><b>Ewwe</b> - <em>Před 9 hodinami</em></span>
            </div>
            <div class="card-block">
                <p class="card-text">gTracker 2.1</p>
                <div class="card-text">
                    <a class="btn btn-sm btn-danger-outline pull-left"><b>+1</b></a>
                    <a class="btn btn-sm btn-primary pull-right"><i class="fa fa-comments-o"></i> 10</a>
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="card-footer text-muted">
                <div class="input-group input-group-sm">
                    <input type="text" class="form-control" placeholder="Napiš komentář">
                    <span class="input-group-btn">
                        <button class="btn btn-primary-outline" type="button"><i class="fa fa-edit"></i></button>
                    </span>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top img-responsive" src="http://expertik.ewolutions.cz/data.jpg" alt="Card image cap">
            <div class="card-img-overlay" style="height:180px;">
                <img class="img-circle img-thumbnail" src="https://minotar.net/avatar/Ewwe" width="64" height="64" alt="Avatar">
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
/*!
 * Bootstrap v4.0.0-alpha (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
@charset "UTF-8";
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
      -ms-text-size-adjust: 100%;
}
body {
  margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}
audio,
canvas,
progress,
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Feed tiles [ Bootstrap 4]"
Bootstrap 3.3.0 Snippet by TheRealEwolutions

Related: See More

Questions / Comments:

"Feed tiles [ Bootstrap 4]" Bootstrap 3.3.0 Snippet by TheRealEwolutions

Related: See More

Questions / Comments:

"Feed tiles [ Bootstrap 4]"
Bootstrap 3.3.0 Snippet by TheRealEwolutions