www.webdeveloper.com
Results 1 to 4 of 4

Thread: background problem

  1. #1
    Join Date
    Apr 2005
    Location
    Behind my DiGiCo SD7 Console
    Posts
    900

    background problem

    Hi,

    I want to get the image on the same line as "Your browser passed the" almost right next to that line.

    Please see the attached image.

    This is what I have for code:
    HTML Code:
     
    <span style="background:url(images/TEST_IMAGES/accept.png) no-repeat left center; padding:10px; margin-bottom:10px;">Your browser passed the<br />requirements to use our service!</span>
    Attached Images Attached Images
    Registered Linux User: #463250
    -----------------
    HELPFUL LINKS
    PHP - http://www.php.net
    Website Color Schemer - http://www.colorschemer.com/online.html

  2. #2
    Join Date
    Nov 2010
    Location
    Los Angeles, CA
    Posts
    234
    a span is an inline element. You can't apply margins, padding, width or height to inline elements. Only block and inline-block elements can have such rules applied. If you change this to a block level element like a <p> or <div> you can use those.

    If you want the check to appear at the right side, change "left center" to "right top" or use pixel offsets.

  3. #3
    Join Date
    Aug 2008
    Location
    Phoenix, AZ
    Posts
    84
    Have you tried expanding your background options on the css? Like this:
    HTML Code:
    <span style="background-image:url(images/TEST_IMAGES/accept.png); background-repeat:no-repeat; background-position: left center; padding:10px; margin-bottom:10px;">Your browser passed the<br />requirements to use our service!</span>
    And you can actually put in numberical values for background-position. It can be found here: http://www.w3schools.com/css/pr_background-position.asp
    Keep your nose to the grindstone, it sharpens your boogers.

  4. #4
    Join Date
    Dec 2009
    Location
    London
    Posts
    12
    As far as I understand, right now you have that image in the vertical middle, but you want it to be in the top-left corner.

    Try 0 0 instead of left center in your background rule.

    Also, you might find it useful to add a rule to display your span as a block element by display:block

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles