"frise"
Bootstrap 4.0.0 Snippet by jonusbaum

Post to Facebook Tweet this

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/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.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 ---------->
<div class="container">
<div class="row">
<article class="col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable">
<div id="wid-id-0">
<header role="heading">
<h2>Very Basic Wizard Example </h2>
</header>
<!-- widget div-->
<div role="content">
<!-- widget content -->
<div class="widget-body">
<div class="row">
<form id="wizard-1" novalidate="novalidate">
<div id="bootstrap-wizard-1" class="col-sm-12">
<div class="form-bootstrapWizard">
<ul class="bootstrapWizard form-wizard">
<li class="complete" data-target="#step1">
<a href="#tab1" data-toggle="tab"> <span class="step"></span> <span class="title">Caracteristiques</span> </a>
</li>
<li data-target="#step2" class="complete">
<a href="#tab2" data-toggle="tab"> <span class="step"></span> <span class="title">Dates</span> </a>
</li>
<li data-target="#step3" class="complete">
<a href="#tab3" data-toggle="tab"> <span class="step"></span> <span class="title">Locataire</span> </a>
</li>
<li data-target="#step4" class="complete">
<a href="#tab4" data-toggle="tab"> <span class="step"></span> <span class="title">Lots</span> </a>
</li>
<li data-target="#step4">
<a href="#tab4" data-toggle="tab"> <span class="step"></span> <span class="title">Loyer</span> </a>
</li>
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
/*Start Wizard*/
form#wizard-1 {
width: 100%;
}
.bootstrapWizard {
display: block;
list-style: none;
padding: 0;
position: relative;
width: 100%
}
.bootstrapWizard a:hover,.bootstrapWizard a:active,.bootstrapWizard a:focus {
text-decoration: none
}
.bootstrapWizard li {
display: block;
float: left;
width: 13%;
text-align: center;
padding-left: 0;
height:100px;
}
/*ligne*/
.bootstrapWizard li.complete:before {
border-top: 5px solid #DA6400;
content: "";
display: block;
font-size: 0;
overflow: hidden;
position: relative;
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Paper Dashboard Pro

Questions / Comments: