My Widget is Messed Up

Hello, I have a widget on my forum that recently someone altered (I think) and now it's all jacked up.

Right now it looks like this: 


Whereas it is supposed to look like this: 

(Sorry for not capturing the full widget on this one, I just happened to have it in my pictures and thought it would help.)

My code is like this 

Code:

<style>

a.link1 {
display:block;
height:40px;
background:url(http://i.imgur.com/urXWR.png) repeat-x 0 0;
font-family: Verdana,Arial,Helvetica,sans-serif;
font-weight:bold;
font-size: 14px;
}


center {
position: relative;
top: 0px;
}
</style><a href="http://orichalcosforums.forumotion.com/t1214-oda-starter-guide#11735" class="link1"></a>
<center>
   Starter Guide
</center><a href="http://orichalcosforums.forumotion.com/chatbox/index.forum"></a>
<center>
   ODA Chatbox 
</center><a href="http://orichalcosforums.forumotion.com/t1347-oda-rules#25114" class="link1"></a>
<center>
   Rules 
</center><a href="http://orichalcosforums.forumotion.com/f2-announcements" class="link1"></a>
<center>
   Most Recent Lesson 
</center><a href="http://orichalcosforums.forumotion.com/t2241-lesson-18-spell-trap-effects-activate-and-spell-speed#23076" class="link1"></a>
<center>
   Introductions 
</center><a href="http://orichalcosforums.forumotion.com/f12-introductions-and-farewells" class="link1"></a>
<center>
   ODA Arena 
</center><a href="http://orichalcosforums.forumotion.com/f11-oda-arena" class="link1"></a>
<center>
   ODA Shop 
</center><a href="http://orichalcosforums.forumotion.com/t1433-orichalcos-duel-academy-main-shop" class="link1"></a>
<center>
   Orichalcos Event 
</center><a href="http://orichalcosforums.forumotion.com/t2082-progression-orichalcos-event#21460" class="link1"></a>

Does anyone recognize this code, or know how to fix it?  Thanks in advance.

Hello Evilpath,

The text was outside of the hyperlink tags, and some CSS was missing.

Replace with :

Code:

<style>

    a.link1 {
    display:block;
    height:40px;
    background:url(http://i.imgur.com/urXWR.png) repeat-x 0 0;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-weight:bold;
    font-size: 14px;
    text-align:center;
    text-decoration:none;
    color:#fff;
    }


    center {
    position: relative;
    top: 0px;
    }
    </style><a href="http://orichalcosforums.forumotion.com/t1214-oda-starter-guide#11735" class="link1">Starter Guide</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/chatbox/index.forum" class="link1">ODA Chatbox</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t1347-oda-rules#25114" class="link1">Rules</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/f2-announcements" class="link1">Most Recent Lesson</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t2241-lesson-18-spell-trap-effects-activate-and-spell-speed#23076" class="link1">Introductions</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/f12-introductions-and-farewells" class="link1">ODA Arena</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/f11-oda-arena" class="link1">ODA Shop</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t1433-orichalcos-duel-academy-main-shop" class="link1">Orichalcos Event</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t2082-progression-orichalcos-event#21460" class="link1">Orichalcos Event Prog</a>

That helped, but the text is sort of vertically off-centered... any help with that?

Try this :

Code:

<style>

    a.link1 {
    display:block;
    padding-top:10px;
    padding-bottom:10px;
    background:url(http://i.imgur.com/urXWR.png) repeat-x 0 0;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-weight:bold;
    font-size: 12px;
    text-align:center;
    text-decoration:none;
    color:#fff;
    }


    center {
    position: relative;
    top: 0px;
    }
    </style><a href="http://orichalcosforums.forumotion.com/t1214-oda-starter-guide#11735" class="link1">Starter Guide</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/chatbox/index.forum" class="link1">ODA Chatbox</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t1347-oda-rules#25114" class="link1">Rules</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/f2-announcements" class="link1">Most Recent Lesson</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t2241-lesson-18-spell-trap-effects-activate-and-spell-speed#23076" class="link1">Introductions</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/f12-introductions-and-farewells" class="link1">ODA Arena</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/f11-oda-arena" class="link1">ODA Shop</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t1433-orichalcos-duel-academy-main-shop" class="link1">Orichalcos Event</a>
<center>
</center><a href="http://orichalcosforums.forumotion.com/t2082-progression-orichalcos-event#21460" class="link1">Orichalcos Event Prog</a>

It would be better to use padding instead of height, seeing as the link has no parent element.

I'll be completely honest with you, I have no clue what that meant.  However, it's fixed now, so thanks.

You're welcome, hehe don't mind my jargon

Topic solved and archived