WordPress.org

Ready to get started?Download WordPress

Forums

Place background behind specific area of sidebar (7 posts)

  1. ddamron44
    Member
    Posted 4 years ago #

    I would like to place an image behind the subscription area at the top right of my sidebar at http://runningsomewhere.com . What is the html to do this and where do I place said html?

    Thanks ahead of time...

    David Damron
    Runningsomewhere.com

  2. alchymyth
    Forum Moderator
    Posted 4 years ago #

    you could do it with css -
    in style.css find the style for .sidebar and add your image as a background image to it;
    background: url(pathto/yourimage.png) 100px 100px no-repeat;

    change the 100px to finetune the position (first value is horizontal from left, second is vertical from top)

  3. ddamron44
    Member
    Posted 4 years ago #

    Changing the "100px" position....is that in position to the entire site or just the sidebar. I changed the position to 100px to 0px and 50px and neither showed up?

    Thanks again

    Dave

  4. alchymyth
    Forum Moderator
    Posted 4 years ago #

    it is the position relative to the edges of the div .sidebar;

    best to start off with 0px 0px;

    what is the image url?

    can't see any code changes in you r style.css at the moment.

  5. ddamron44
    Member
    Posted 4 years ago #

    First, thanks for your time!
    Image url is: http://runningsomewhere.com/wp-content/uploads/2010/05/runsomesideback.jpg

    I can and will resize image url accordingly.

    Any ideas?...thanks

    I placed the code as you can see below:

    /* SIDEBAR(S) */
    
    background: url(pathto/http://runningsomewhere.com/wp-content/uploads/2010/05/runsomesideback.jpg) 10px 10px no-repeat;
    
    .sidebaradbox {
    	margin-top: 5px;
    	text-align:center;
    	}
    
    .ad125 {
    	margin: 6px;
    	}
    
    .sidebar {
    	margin: 0 10px 10px 10px;
        color: #3f474d;
        font-size: 13px;
    	}
    
    .sidebar a {
    	text-decoration: none;
    	color: #171e2a;
    	}
  6. alchymyth
    Forum Moderator
    Posted 4 years ago #

    code needs to be:

    .sidebar {
    	margin: 0 10px 10px 10px;
        color: #3f474d;
        font-size: 13px;
    background: url(http://runningsomewhere.com/wp-content/uploads/2010/05/runsomesideback.jpg) 10px 10px no-repeat;
    	}

    the background declaration needs to be in the .sidebar style.

    you might want to read up on css:
    http://www.w3schools.com/css/default.asp
    http://www.w3schools.com/css/css_background.asp

  7. ddamron44
    Member
    Posted 4 years ago #

    Sweet....Thanks for all your help....

    David

Topic Closed

This topic has been closed to new replies.

About this Topic