PDA

View Full Version : How To Center Your Logo (tutorial)


mandingo
30 Dec 2009, 17:15
I've seen a few people asking this so I'm going to lay out how I did mine:
---------------------------------------------------------------------------------------
1. Go into vbulletin-chrome.css
and find:
.logo-image {
float: {vb:stylevar left};
}
Change it to
.logo-image {
text-align: center;
}
----------------------------------------------------------------------------------------
Then,go to the header template and find:
<div><a name="top" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></div>
Change it to:
<div style="float: left; width: 825px;">
<div style="width: 300px; margin-left: auto; margin-right: auto;"><a name="top" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></div></div>

Adjust the numbers in red until you get the desired results,you can move it anywhere from right to left.
------------------------------------------------------------------------------------------
There is probably an easier way to do this with a little less code,but it works.I will update as better code is posted.

AUtigers350z
27 Jan 2010, 05:04
I was trying to figure out how to do this for a while and wound up taking the div's out of your code in the header template and just wrapping center tags around the rest..

<center><a name="top" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></center>

Works great and floats when the page size is adjusted.

neparker
20 Feb 2010, 22:41
I would like to center mine, but I'm not sure where the vbulletin-chrome.css file is located. Any help would be greatly appreciated. Thanks.

borbole
21 Feb 2010, 16:33
I was trying to figure out how to do this for a while and wound up taking the div's out of your code in the header template and just wrapping center tags around the rest..

<center><a name="top" href="{vb:raw vboptions.forumhome}.php{vb:raw session.sessionurl_q}" class="logo-image"><img src="{vb:stylevar titleimage}" alt="{vb:rawphrase x_powered_by_vbulletin, {vb:raw vboptions.bbtitle}}" /></a></center>

Works great and floats when the page size is adjusted.

Center tags have been depricated a long time ago.

I would like to center mine, but I'm not sure where the vbulletin-chrome.css file is located. Any help would be greatly appreciated. Thanks.


Acp-Style and templates-Edit Templates-CSS Templates.

mandingo
21 Feb 2010, 16:38
Word borbole,thanks for jumping in. Really is a drag that <center> died off though.

neparker
21 Feb 2010, 16:44
so how to you make it centered now in vB4?

Toneboy
24 Mar 2010, 20:24
Really handy, and IMHO a bit less fiddly tip can be found here:
http://www.vbulletin.com/forum/showthread.php?343353-Center-logo