Top bar html

Hi there, Im working on this site:

http://txadproofs.com/columbusjellystone.com/

Im trying to put the logo and a background image into the top bar. I want the background image and logo centered, but A: Its not displaying the background image, and B: The logo is not centered.

This is the html I have in there at the moment:

.topheader { display: block; margin-left: auto; margin-right: auto; } body { background-image: url(http://txadproofs.com/columbusjellystone.com/wp-content/uploads/2017/10/topheaderback *I have taken out the ext as it wont allow me to post more than one image); background-repeat: repeat-x; background-attachment: fixed; background-position: center; top: 0px; background-position-y: 0px; width: 100%; } This is the image of what I am trying to achieve:

http://txadproofs.com/columbusjellystone.com/wp-content/uploads/2017/10/Untitled-4 .png

I hope you can help.

Thanks.

*** I had to alter the ext of the html in this post as it wouldnt allow me to post with images.

I noticed if I change the color of the topbar, it shows the color instead of the image, how do I disable the color? would this solve the issue of displaying the background?

Hi There,

Thank you for writing in, I see that you added your styling on the topbar as well. Please remove your custom CSS from the topbar. Add the custom CSS in the Theme Options > CSS instead.

/*background-image on topbar*/
.x-topbar {
	background-image: url(http://txadproofs.com/columbusjellystone.com/wp-content/uploads/2017/10/topheaderback.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

/*to center the topbar content */
.x-topbar .p-info {
	float: none;
	margin-left: auto;
    margin-right: auto;
    width: 274px;
}

If you’re wondering how did I post the code like that, please wrap your code in 3 back ticks.

screenshot

Hope it helps,
Cheers!

That worked perfectly! thanks!

You’re welcome.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.