Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > Misaligned Reply, Edit, Reply & Quote and Delete icons
Guppy Queen (New Admin) 5/12/2009 9:44 PM EST : Misaligned Reply, Edit, Reply & Quote and Delete icons
Guppy Queen
Posts: 41034
Zomgawsh Poster

The Reply, Edit, Reply & Quote and Delete icons have been altered. They are now misaligned on the my forums.

Mottie, do you have a script to fix this ?
TopBottom

Svana (New Admin) 5/13/2009 7:44 AM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
Svana
Posts: 2343
Zomgawsh Poster

They're also misaligned on mine and it just happend over night. I'm guessing that GP did something that caused this.  I'm using a built in set so this is probably an 'unintended feature'.
TopBottom

Synewyn of Rohan (Guild Admin) 5/13/2009 7:59 AM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
Synewyn of Rohan
Posts: 352
Fingers of Fury!

I made our sites graphics and such and it appears that 3 of the 4 forum "buttons" now have our graphic for the box headers added around the reply, edit and quote, but not the trash.  O.o

It also appeared yesterday.


TopBottom

Mottie (MVP) 5/13/2009 9:15 AM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Hi Everyone!

It looks like there was some CSS added to float the buttons, which is why it is misaligned now. Try adding this CSS into a free form text/HTML box on your forums page. You may have to adjust the padding in the MessageToolsCell1 and ToolLinkButton classes if you have borders around your images like Guppy Queen does.
.MessageToolsCell1 { padding:10px !important; }
.ToolLinkButton img { float:none; margin-right:0px;}
.ToolLinkButton, a.ToolLinkButton {
 display:inline;
 float:none;
 padding:15px 5px 5px 5px;
}
The padding with 4 varibles is a shortcut for defining the padding for the top, right, bottom and left (in that order).

And as Synewyn of Rohan noticed, the delete button is actually an HTML input button and not an image like the rest of the buttons. You may have to add CSS like the following to add style to it (made to match Guppy Queen's site):
.MessageToolsCell1 input {
 -moz-border-radius-bottomleft:5px;
 -moz-border-radius-bottomright:5px;
 -moz-border-radius-topleft:5px;
 -moz-border-radius-topright:5px;
 padding:10px;
 border:solid #333333;
 border-width: 1px !important;
 vertical-align:middle;
}
TopBottom

Guppy Queen (New Admin) 5/13/2009 11:45 AM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
Guppy Queen
Posts: 41034
Zomgawsh Poster

Hi Mottie, I tried adding the code below in a Free Form HTML box.

.MessageToolsCell1 input {
 -moz-border-radius-bottomleft:5px;
 -moz-border-radius-bottomright:5px;
 -moz-border-radius-topleft:5px;
 -moz-border-radius-topright:5px;
 padding:10px;
 border:solid #333333;
 border-width: 1px !important;
 vertical-align:middle;
}


But, it doesn't work. This is what it looked like:

http://img19.imageshack.us/img19/8185/picture2amu.jpg

TopBottom

Mottie (MVP) 5/13/2009 6:35 PM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Oh sorry...

Add a <style> at the top and </style> at the bottom like this:
<style type="text/css">
.MessageToolsCell1 input {

 -moz-border-radius-bottomleft:5px;
 -moz-border-radius-bottomright:5px;
 -moz-border-radius-topleft:5px;
 -moz-border-radius-topright:5px;
 padding:10px;
 border:solid #333333;
 border-width: 1px !important;
 vertical-align:middle;
}
</style>
TopBottom

Guppy Queen (New Admin) 5/13/2009 9:15 PM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
Guppy Queen
Posts: 41034
Zomgawsh Poster

Thanks Mottie. Sadly, it looks like this now:

   
TopBottom

Mottie (MVP) 5/14/2009 8:28 AM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Hi Guppy!

Oh wait, did you add both pieces of CSS? The whole thing should look like this:
<style type="text/css">
.MessageToolsCell1 { padding:10px !important; }
.ToolLinkButton img { float:none; margin-right:0px;}
.ToolLinkButton, a.ToolLinkButton {
 display:inline;
 float:none;
 padding:15px 5px 5px 5px;
}
.MessageToolsCell1 input {
 -moz-border-radius-bottomleft:5px;
 -moz-border-radius-bottomright:5px;
 -moz-border-radius-topleft:5px;
 -moz-border-radius-topright:5px;
 padding:10px;
 border:solid #333333;
 border-width: 1px !important;
 vertical-align:middle;
}
</style>
TopBottom

Aaron Lewis (Blue Collar) 5/14/2009 9:32 AM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
GuildPortal Dev
Aaron Lewis
Posts: 1979
Zomgawsh Poster

Fix for this coming out tonight.

What I'll be doing is removing the ToolLinkButton class from the anchor tag surrounding custom images in the tools cell.  Was an oversight -- the new class was only meant to appear when no custom images were present.
Aaron Lewis, GuildPortal.com
TopBottom

Guppy Queen (New Admin) 5/14/2009 11:10 AM EST : RE: Misaligned Reply, Edit, Reply & Quote and Delete ...
Guppy Queen
Posts: 41034
Zomgawsh Poster

Thank you Mottie  I will wait until the fix tonight. Thanks Aaron 
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%