<!DOCTYPE html>

<html>

<head>

<title>3 испытание: фильтры</title>

</head>

<body>

<div>

<div>

</div>

<div>

от <input type="text" value="5 000">

до <input type="text" value="15 000">

</div>

</div>

<div>

<div>

</div>

<div>

от <input type="text" value="1 000">

до <input type="text" value="2 000">

</div>

</div>

</body>

</html>

--------

html,body{

margin:0;

padding:0;

}

body{

width:450px;

height:300px;

font-size:16px;

font-family:"Tahoma", sans-serif;

color:black;

background:white;

}

.range-filter{

padding-top:10px;

width:240px;

margin:auto;

margin-bottom:10px;

}

.range-controls{

position:relative;

height:80px;

margin-bottom:15px;

padding:0 30px;

background:#34495e;

border-radius:5px;

overflow:hidden;

}

.scale{

margin-top:39px;

height:2px;

background:#d7dcde;

}

.bar{

height:2px;

background:#00ca74;

}

.toggle{

position:absolute;

top:30px;

left:30px;

width:4px;

height:4px;

border:8px solid white;

background:#ababab;

cursor:pointer;

border-radius:50%;

}

.min-toggle{

left:70px;

}

.max-toggle{

left:165px;

}

.price-controls .min-price, .price-controls .max-price{

width:55px;

padding:8px 10px;

margin-left:10px;

border:none;

background:#34495e;

font-size:16px;

font-family:"Tahoma", sans-serif;

text-align:center;

color:#283136;

border-radius:5px;

color:white;

}

.max-price {

margin-right:14px;

}

Лия Lia

Пройти Неделю 7 курса "Веб-программирование"

Don't miss new posts!

Signup

Sign in.Allowed.

Widget for your goal

Big (450×150 px)

Small (250×100 px)

For PRO only

[email protected]

Maxim Malikov

Sergey Zakharov

Sign in.
Allowed.