[Elaine S]

The width of the header is 1110 so to add a logo which is only 250 px wide when uploaded it stretches across the whole page and is distorted.   Is there away to adjust the width of the image as well as the depth for example what if the logo is 350px x 100 px?   Thanks for the wonderful support!

[Grady]

Hey,

I was able to do this on my site with this code,

#header {
background-image: url(‘http://localhost/wordpress/wp-content/uploads/2013/02/build.jpg’);
background-repeat:repeat-y;
background-size: 100%;
background-position: top left;
}

 

This repeated the image along the Y plane (XY plane in math) but stretched it across with the -size:100%.

 

You can read about it here W3schools. If you have any questions let me know.

Grady

[Elaine S]

Hi Grady:   Thanks for your help, I put the following code in miscellaneous settings in appearance/mantra settings, but it didn’t work, is there a different place to put the code, or is the code incorrect?  Regards

 

/* Mantra Custom CSS */

#header

{

background-image::url(“http:wordpressoddballexotics.xlconsultinggroup.com/wpcontent/uploads/2013/012/logo_197282_web.jpeg”;)

background-size: 200px 60px;

background-repeat:no-repeat;

padding-top 40px;

background-position: top left;

}

[Grady]

Hey,

Simple typing mistake, you have

background-image::url(

and it needs to only have one : background-image:url(

I also went to your site and I found another issue,
This is what you have

#header {
background-image: :url(“http:wordpressoddballexotics.xlconsultinggroup.com/wpcontent/uploads/2013/012/logo_197 282_web.jpeg”😉
background-size: 200px 60px;
background-repeat: no-repeat;
background-position: top left;
}

I did some edits to make it work,

#header {
background-image: url(“http:wordpressoddballexotics.xlconsultinggroup.com/wpcontent/uploads/2013/012/logo_197 282_web.jpeg”) ;
background-size: 200px 60px;
background-repeat: no-repeat;
background-position: top left;
}

I was not able to full test it as the image has since been removed or changed. But a simple lesson is coding, the ; is always at the very very end of each line. It is a “period” of code.

Grady

[Elaine S]

Hi Grady:

Thanks for your great help, but somehow its still not working.   What am I missing?

I typed the following into the settings and changed the picture to a png version of the logo. I have this in my media library and copied the path, but somehow the logo is not showing on the presentation page.   I took out the Title in the General settings because I thought that might have something to do with it, but still no logo is appearing.   Do you have any other suggestions?   Thanks for the awesome help as I’m a newbie at this!

/* Mantra Custom CSS */

#header

{

background-image::url(“http://wordpressoddballexotics.xlconsultinggroup.com/wp-content/uploads/2013/02/Williams-logo6.png”);

background-size: 200px 75px;

background-repeat:no-repeat;

padding-top 40px;

background-position: top left;

}

[Zed]

There are some typos in there. For example, there are two : after background-image instead of one. Should be:

background-image:url("http://wordpressoddballexotics.xlconsultinggroup.com/wp-content/uploads/2013/02/Williams-logo6.png");

---

If you like our creations, help us share by rating them on WordPress.org.
Please check the available documentation and search the forums before starting a topic.

[Elaine S]

Hi Zed:

Thanks everyone for the support, I love this theme because it is easily adaptable for people who don’t know a lot of coding and the support is fantastic.   I fixed the code and now I have a logo in the top left above the navigation bar!   Wonderful.

 

[E. B. vds]

|

[Author]

Posts