My iPhone lockscreen theme features various elements displaying weather facts such as text and small images. Currently, these elements are positioned in the middle of the screen and I want to move them all to the top. Each element has a unique position absolute and z-indexes. Should I adjust the top value for each? Or should I group them together and how do I go about moving them all up? Just a reminder - this theme allows the use of JS, HTML, and CSS.
UPDATE here is the code! -
<style type="text/css">
.weekday
{
position: absolute;
top: 252px;
left: -18px;
width: 320px;
height: 60px;
text-align:right;
font-family:source_sans_prolight;
font-weight:100;
font-size: 13px;
color: white;
text-transform:lowercase;
}
</style>
<style type="text/css" >
.month{
position: absolute;
top: 268px;
width: 320px;
left: -33px;
height: 60px;
text-align:right;
font-family:source_sans_prolight;
font-weight:100;
font-size: 13px;
color: white;
text-transform:lowercase;
}
</style>
<style type= "text/css">
.date{
position: absolute;
top: 268px;
width: 320px;
left: -18px;
text-align:right;
font-family:source_sans_prolight;
font-weight:100; font-size:
13px;
color: white;
}
</style>
<style type="text/css">
.icon{
position: absolute;
z-index:10;
left: 15px;
top: 200px;
}
</style>
<style type="text/css">
#temp{
position:absolute;
z-index:7;
color:white;
top: 251px;
left:40px;
width: 320px;
font-size:15px;
font-weight:200;
font-family: source_sans_prolight;
}
</style>
<style type="text/css">
#clock{
position:absolute;
width: 320px;
height: 200px;
left: -15px;
text-align: right;
z-index: +4;
top: 194px;
font-family: source_sans_prolight;
color:white;
font-size: 55px;
font-weight: 100;
}
</style>
There is more, but that is what it looks like!