This can get tricky. It all depends on how you add your header logo, i.e. upload via All Options (Header Image or Network Logo), or if you add via Advanced CSS.

The safest bet is to create an image with a width of 955 pixels. This enables you to get all your centering done within your image.

Otherwise, if you uploaded your header via "Manage/Appearance/All Options/Network Logo", you should be able to add this code to Advanced CSS, and center your logo.
#xg_masthead p#xg_sitename { text-align:center!important; }

If this doesn't work for you, let me know. Leave your URL, and I'll try to add your particular "case" example.

Views: 1137

Replies to This Discussion

OMG! Thank you soooo much for posting this! I had a dickens of a time trying to figure out how to get it centered! You rock!
Glad it helped!
;-)
Its amazing how something so simple turned out to be so darn complicated...it didnt help I dont know how to write html or css codes. Do you know I can find a decent banner making site? I've tried bannerfans.com but I cant load the pic I want without messing up the picture.
It always better to create banners from scratch in an image creating software like Photoshop. But, if you don't have that option, these are the only ones I've ever really noticed online.
They're not banner makers, so to speak - - just different image creation type software apps.

http://theningdirectory.ning.com/group/ningnetworktips/forum/topics...

http://theningdirectory.ning.com/group/ningnetworktips/forum/topics...
Ahh ty Jen...Its been recommended that I get Photoshop and if Im not mistaken I believe I had that program on my machine before but I could never figure out how to use the darn thing! *Sighs* one thing I am not is technically minded lol. But I will check out the links you posted...thank you very much for all your help today.
Traceditor!
Nice tip!

Yeah, @Lady of the Moon - - I actually do not recommend Photoshop, unless you plan on using it long-term and for real.

It's too darn expensive, otherwise. I can justify it, cause I use it all day, everyday, practically. Plus, you really need to use it regularly, to fully utilize it.

Best,
Jen
Another option is the Gimp. It has similar tools to photoshop but its free. You can do some cool things with it.

You can find it here, this version is for windows, I use linux which comes with the gimp.

http://www.gimp.org/windows/
Thanks Lex!
:-)
Hello - for some reason the header does not seemed to center. I added different CSS code like the one you have indicated and others and even changed others and still nothing. Also, if I removed the last line of the code for the visiblity hidden, the logo would disappear and only text shows up. Can you tell me what is wrong? Thanks very much.

http://empressplace.com

Here is the code now:

#xg_masthead p#xg_sitename { text-align:center!important; }


#xg {
margin:0;
width:auto;
}

#xg_head {
width:auto;
}

#xg_foot {
height:1.5em;
}

#xg_head #xg_masthead p#xg_sitename, #xg_head #xg_masthead p#xg_sitedesc, #xg_head ul, #xg_body, #xg_foot {
width:945px;
margin-left:auto;
margin-right:auto;
float:none;
}

#xg_head #xg_masthead #xg_sitename {
padding-top:42px;
line-height:1.2em;
*line-height:1.5em;
}

#xg_sitename a {
font-size:46px;
font-weight:bold;
zoom:1;
}

.xg_module_head h2 {
font-weight:normal;
}

#xg_masthead p#xg_sitedesc {
line-height:1.2em;
height:1.2em;
font-size:20px;
font-weight:bold;
color:#ffffff;
}

.xg_module_head {
font-size:14px;
border-bottom:2px solid #A864A9;
color:#ffffff;
}

#xg_head #xg_masthead {
background-color:#A864A9;
padding:0 0 19px 0px;
}

ul.page_tabs li.this {
background-color:#ffffff;
}

#xg_navigation {
background-color:#575757;
margin:0;
padding:0 0 5px;
}

#xg_navigation ul li a {
color:#ffffff;
padding:8px 10px 0;
}

#xg_navigation ul li.this a {
background-color: #A864A9;
}

.xg_module_foot {
background-color:#ffffff;
}

#xg_masthead {visibility:hidden;}
Because you are adding the logo as a background image, I believe you'll need this code:
#xg, .xg_headerbg {background-position:center top;}
Thank you very much - it works now. I missed this completely - thanks again!
This is great.
It centered my Logo.
I tried the same with the tag line but it wouldn't center it.
#xg_masthead p#xg_sitedesc { text-align:center!important; }

It will center the tag line if I take out the Logo text-align info. So it will only allow me to do one.

What is the best way of doing both?
Thanks.

RSS

Members

© 2024   Created by JenSocial.   Powered by

Badges  |  Report an Issue  |  Terms of Service

Home
VIP Ning Tips