To make the page presentable and structured, we need to add CSS properties for different elements. We will do this inside the head section. Go to the head section in the index.html file and write these CSS properties for different elements:
<style type="text/css">
body{
color:#025c7f;
font-family:Georgia,arial,verdana;
width:700px;
margin:0 auto;
}
.container{
margin:0 auto;
font-size:14px;
position:relative;
width:700px;
text-align:justify;
}
#textBlock{
color:#000000;
background-color: #ffffff;
}
.ui-state-highlight{
padding: 10px;
background: none;
}
.controlsContainer{
border: 1px solid;
margin: 0;
padding: 0;
width: 100%;
float: left;
}
.controlsContainer li{
display: inline-block;
float: left;
padding: 0 0 0 50px;
width: 299px;
}
.controlsContainer div.ui-slider{
margin: 15px 0 0;
width: 200px;
float:left;
...