SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    May 2009
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Can't change to the opposite value of "background-position"

    Hey!

    I have some issue with changing to the opposite value of the background-position property.
    As you know, if I want to change the value from Left to Right or Right to Left I can do this as you can see in this example:
    Code:
    background-position: 0 10px; -> background-position: 100% 10px;
    background-position: right 10px -> background-position: left 10px;
    But what is the opposite value of the following:
    Code:
    background-position: 5px 10px
    (Because the pixels is relative to the left. how can I change it to be relative to the right?)

    Thanks!

  2. #2
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,734
    Mentioned
    31 Post(s)
    Tagged
    1 Thread(s)
    Welcome to Sitepoint, Scolpy.

    I was having a similar issue years ago. I am afraid, if I am understanding your issue correctly that in CSS2.1 you just can't to that. CSS3 promises to address this, but right now support is so limited it's not worth mentioning it as a solution.

    If you are positioning the bg image to the right and need space, in PX from the right edge, you can use a GIF/PNG add that # of transparent px to the right of the image, if your BG is a solid color, you can always match the BG color as well, in which case you can also use JPGs)

    Of course, if you know the size of your container, you can just do math; position= container_size- (size_of_image+right_offset).

    For now this is the the tried and true way of getting around this issue.

    Hope that helped a little, at least


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •