Menu
In this case
li {background: url("../img/grey-arrow-next.png") no-repeat right center; border-bottom: 1px solid #D4E8EB} I want 20px space in right side before to background image and I can't give margin on li because border should touch the edges.
So I need to set 20px but it takes 20px from left side not right side.
li {background: url("../img/grey-arrow-next.png") no-repeat 20px center; border-bottom: 1px solid #D4E8EB} 
454
Give it a shot. Essentially, background-position: 90% 50% will make the right edge of the background image line up 10% away from the right edge of the container. Create a div containing the image. Explicitly set the position of the containing element position: relative if not already set.
To keep your background fixed, scroll, or local in CSS, we have to use the background-attachment property. Background-attachment: This property is used in CSS to set a background image as fixed or scroll. The default value of this property is scroll.
The background-position CSS property sets the initial position for each background image. The position is relative to the position layer set by background-origin .
The background-attachment CSS property sets whether a background image's position is fixed within the viewport, or scrolls with its containing block.
in your css mention position right then "spacing value(50px)" then other position(center/top)
li {background: url("../img/grey-arrow-next.png") no-repeat right 50px center; border-bottom: 1px solid #D4E8EB} Older Browser and IE8 and old version of IE does not support this code. Latest updated browsers has no conflicts with this method and hopefully future updates will support it too.
If you are using modern browser, try background-position: calc(100% - 50px) center; as suggested in another answer too. calc has long way to go as it is logically and mathematically capable to produce much accurate result.
110
You can use the CSS3 "calc" function:
example:
background-position: calc(100% - 10px) center; If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
