JSFiddle - React, Tailwind, and code Playground
by GaryC123
HTML
<p><a href="http://www.widener.edu/admissions/undergraduate/contact/default.aspx"
target="_blank">
<span class="wuname">Dr. Jason Britton</span></a>
<span class="wuphone">p: 610-499-4131<br>f: 610-499-4676</span>
<a href="mailto:[email protected]"><span
class="wuemail">[email protected]</span></a>
<span class="wutitle">Associate Director of Admissions</span>
<a href="http://www.widener.edu/admissions/undergraduate/contact/default.aspx"
target="_blank">
<span class="wideneredu">www.Widener.edu <br> #ChooseWidener</span></a>
<span class="choosewidener_twitter"><a href="https://twitter.com/choosewidener"
alt="TWEET" target="_blank"/><img
src="/a.widener.edu/webdev/widener_email_signature/widener_edu_twitter_choosewidene
r.gif" border="0" height="35" width="35" /></a></span>
<span class="choosewidener_instagram">
<a href="http://instagram.com/choosewidener" alt="PHOTO" target="_blank"/><img
src="//a.widener.edu/webdev/widener_email_signature/widener_edu_instagram_choosewid
ener.gif" border="0" height="35" width="35"/></a></span>
<span class="visit_widener_edu"><a
href="http://www.widener.edu/admissions/undergraduate/visit_widener/" alt="VISIT /
TOUR" target="_blank" style="padding: 4px; border: 1px solid rgb(0, 0, 0);
color:white; font-size: 13px; text-decoration: none; background-color:#5398c2;"
onmouseover="style='background-color:#FEFFEC; border-style:
solid;border-width:3px;text-decoration : none; padding : 3px; border-color :
#FFCC00; color:#415f7a; font-weight:bolder; font-size:13px;'"
onmouseout="style='background-color:#0c4c75; border-style: solid;border-width : 1px
1px 1px 1px;text-decoration : none; padding : 4px; border-color : #000000;
color:#ffba00; font-size:13px;'" >VISIT WIDENER</a></span>
<span class="apply_widener_edu">
<a href="http://www.widener.edu/admissions/default.aspx" alt="APPLY NOW"
target="_blank" style="padding: 4px; border: 1px solid rgb(0, 0, 0);...
CSS
body { font-family:Arial Narrow, Helvetica, sans-serif;font-variant: normal;}
.choosewidener_twitter {position: absolute;left: 10px; top: 130px; z-index: -1;
padding:0px;}
.choosewidener_instagram {position: absolute;left: 50px; top: 130px; z-index: -1;
padding:0px;}
.visit_widener_edu {
position: absolute;
left: 99px;
top: 140px;
z-index: -1;
padding: 0px;
}
.apply_widener_edu {
position: absolute;
left: 215px;
top: 140px;
z-index: -1;
padding: 0px;
}
a:link {text-decoration: none;}
.wuname {text-decoration:none;position: absolute;left: 19px;top: 27px;z-index:
1;color:#0075be;font-size:22px;font-weight: 700;}
.wutitle {position: absolute;left: 19px;top: 53px;z-index:
1;color:#0075be;font-size:12px;}
.wuemail {text-decoration:none; position: absolute;left: 19px;top: 68px;z-index:
1;color:#0075be;font-size:12px;}
.wuphone {position: absolute;left: 19px;top: 87px;z-index:
1;color:#0075be;font-size:12px;line-height:15.4px;}
.wideneredu {
text-decoration: none;
position: absolute;
left: 126px;
top: 87px;
z-index: 1;
color: #0075be;
font-size: 12px;
line-height: 15.4px;
}