Reputation: 729
I've got a div somewhere closer to the center of the page. Below is the div structure.
<div id="newsFeed">
<img id="thumb" src="news/news123.png" height=50 width=50 />
</div>
css:
#newsFeed{
position: absolute;
width: 100%;
height: 100%;
}
#thumb{
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
How can I move the image 20px to the right from the current position?
Upvotes: 0
Views: 51
Reputation: 87233
You can shift the image to the right by setting its margin-left
to 20px. This will add 20px space to the left of the image, giving impression that image is shifted 20px to the right.
#thumb {
margin-left: 20px;
}
Demo
#newsFeed {
position: absolute;
width: 100%;
height: 100%;
}
#thumb {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin-left: 20px;
}
<div id="newsFeed">
<img id="thumb" src="news/news123.png" height=50 width=50 />
</div>
Alternatively, you can also set the left
to 20px.
#thumb {
....
left: 20px;
}
Demo
#newsFeed {
position: absolute;
width: 100%;
height: 100%;
}
#thumb {
position: absolute;
left: 20px;
right: 0;
top: 0;
bottom: 0;
}
<div id="newsFeed">
<img id="thumb" src="news/news123.png" height=50 width=50 />
</div>
Upvotes: 2