Page 1 of 1

background image query

Posted: Thu Jan 28, 2010 8:43 am
by aravona
I've got a question about background image positioning.

I've got a header and an image on said header (as background-image) that I want positioned on the right. This isnt a problem, I've got it set currently to 'center right'. However I want a bit of padding between the edge of the header and the edge of the picture. And I cant seem to find a way of doing this.

I've tried putting the image within the header.php using a <img scr=" "> tag but no show. So I put it on the CSS file as part of the background. Any ideas?

This is the CSS for the header.

Code: Select all

 
#header {
background: #7d7d7d; 
background-image: url('images/logo.jpg');
background-repeat:no-repeat;
background-position:center right; 
border-bottom: 3px double #aba;
border-left: 1px solid #9a9;
border-right: 1px solid #565;
border-top: 1px solid #9a9;
font: italic normal 230% 'Times New Roman', Times, serif;
letter-spacing: 0.2em;
margin: 0;
padding: 15px 10px 15px 60px;
height:75px;
}

Re: background image query

Posted: Fri Feb 12, 2010 12:06 pm
by social_experiment
I dont know if the background-position has anything to do with this but if I removed it, the image acted weird. Hope this helps.

Code: Select all

#header {    background: #7d7d7d;        background-repeat:no-repeat;    background-position: center right;    border-bottom: 3px double #aba;    border-left: 1px solid #9a9;    border-right: 1px solid #565;   border-top: 1px solid #9a9;   font: italic normal 230% 'Times New Roman', Times, serif;   letter-spacing: 0.2em;   margin: 0;   padding: 15px 10px 15px 60px;   height:75px;  }#header img {    float: right;    padding-right: 20px;}  

Re: background image query

Posted: Wed Feb 17, 2010 5:55 am
by aravona
Looks like it should but putting that in got me nothing - no image at all? What did you do in the html side where you link the image?

Thanks

Re: background image query

Posted: Wed Feb 17, 2010 6:45 am
by social_experiment
:oops: I should have pasted the html too. Here is the example i used, the image width / height will obviously vary according to your own specifications.

Code: Select all

<div id="header">Blog<img src="Untitled-2.png" width="200" height="75" border="0" /></div>

Re: background image query

Posted: Wed Feb 17, 2010 6:54 am
by aravona
Oh ok yeah thats what I did, turns out Wordpress is still very .... obsessive with absolute file paths, cant use a relative :(

Working now :) thanks