How to center username and user title?

[thetechgenius]

I would like to know how to center the Username and Usertitle on the profile page?

Does anyone know how to do this? I know it is done in "additional.css", but I don't know the CSS do add. Could anyone please help me?


Here is a screenshot of my profiles:



--------------- Added [DATE]1403741319[/DATE] at [TIME]1403741319[/TIME] ---------------

I think I might have posted this in the wrong place. My mistake, sorry about that.

I have just created this thread in the "Unpaid" section. Could a Mod or Admin please close this thread? Thank you.

[TheLastSuperman]

Try adding in this css to additional.css:

/* center avatar, username, title, rank, userinfo_extra, postbit_reputation, imlinks */
.postbitlegacy .userinfo .username_container, .postbitlegacy .userinfo .rank, .postbitlegacy .userinfo .usertitle .imlinks {
	text-align:center;
}

.postbitlegacy .userinfo .postuseravatar, .postbitlegacy .userinfo .postuseravatar img {
	float:none;
	text-align:center;
}

.postbitlegacy .userinfo .usertitle {
	display: block;
	float:none;
	text-align:center;
	clear: both;
}

.postbitlegacy .userinfo .userinfo_extra {
	text-align:center;
	clear: both;
}

.postbit_reputation {
	float:none;
	text-align:center;
}

.postbitlegacy .imlinks  {
	float:none;
	text-align:center;
}

.postbitlegacy .after_content {
	clear:right !important;
}

The very top snippet was provided to me by Lynne many many many moons (years ago) so credit to her as she did it first .

[thetechgenius]

Originally Posted by TheLastSuperman

Try adding in this css to additional.css:

/* center avatar, username, title, rank, userinfo_extra, postbit_reputation, imlinks */
.postbitlegacy .userinfo .username_container, .postbitlegacy .userinfo .rank, .postbitlegacy .userinfo .usertitle .imlinks {
	text-align:center;
}

.postbitlegacy .userinfo .postuseravatar, .postbitlegacy .userinfo .postuseravatar img {
	float:none;
	text-align:center;
}

.postbitlegacy .userinfo .usertitle {
	display: block;
	float:none;
	text-align:center;
	clear: both;
}

.postbitlegacy .userinfo .userinfo_extra {
	text-align:center;
	clear: both;
}

.postbit_reputation {
	float:none;
	text-align:center;
}

.postbitlegacy .imlinks  {
	float:none;
	text-align:center;
}

.postbitlegacy .after_content {
	clear:right !important;
}

The very top snippet was provided to me by Lynne many many many moons (years ago) so credit to her as she did it first .

Thank you so much!

It seems to solved most of the centering issues. However, the usertitle is still not centered on the Profile page. You should know that I have setup images for the User Titles, and not text. I don't know if that matters or not. Its not a Mod though, I have <img src="URL"> in the User Title boxes in the AdminCP.

Here is the direct link to my Profile Page on my site: https://thetechgenius.net/members/1-TheTechGenius

[tbworld]

This should not be done with inline CSS. However, it was not cooperating on a remote page and I did not have the extra time to spend on it. This will get you going for now.

Edit your template and make the following change.

Search for:

  <span class="usertitle">

Replace:

  <span style="display:inline-block; text-align:center;" class="usertitle">

[thetechgenius]

Originally Posted by tbworld

This should not be done with inline CSS. However, it was not cooperating on a remote page and I did not have the extra time to spend on it. This will get you going for now.

Edit your template and make the following change.

Search for:

  <span class="usertitle">

Replace:

  <span style="display:inline-block; text-align:center;" class="usertitle">

I edit the MEMBERINFO template, correct?

I did what you said, and still nothing. I tried everything to get this centered. I am really about to give up, and just leave it like that.

Thank you for helping me though, I greatly appreciated!

[tbworld]

Originally Posted by thetechgenius

I edit the MEMBERINFO template, correct?

I did what you said, and still nothing. I tried everything to get this centered. I am really about to give up, and just leave it like that.

Thank you for helping me though, I greatly appreciated!

If you have loaded some kind of modification that is manipulating the template cache then it might be overriding your edits in MEMBERINFO. Also, make sure you are selecting the correct "parent" style to edit. Unfortunately, the only thing I could do is use firebug to observe your style and to create those changes. So I am only seeing the exported code to my browser.