css - Editing the Reddit Enhancement Suite's Userbar -
i'm trying edit res userbar subreddit. looks this:
it collapses.
i want float of elements right lined vertically. html bar is:
<div id="header-bottom-right" class="res-navtop"> <div id="userbartoggle" title="toggle userbar" class="userbarhide">»</div> <span class="user"> <a href="http://www.reddit.com/user/snowe2010/" style="margin-right: 2px;"> snowe2010 </a> <span id="resaccountswitchericon"></span> ( <span class="userkarma" title=""> <a title="link karma" href="/user/snowe2010/submitted/">9</a> · <a title="comment karma" href="/user/snowe2010/comments/"> 2170 </a> </span> ) </span> <span class="separator">|</span> <a title="no new mail" href="http://www.reddit.com/message/inbox/" class="nohavemail" id="mail"></a> <a id="mailcount" href="/message/unread/"></a> <span class="separator">|</span> <a title="no new mod mail" href="http://www.reddit.com/message/moderator/" class="nohavemail" id="modmail">mod messages</a> <span class="separator">|</span> <ul class="flat-list hover"> <li> <a href="http://www.reddit.com/prefs/" class="pref-lang">preferences</a></li> </ul> <span class="separator">|</span> <span id="openresprefs"> <span id="ressettingsbutton" title="res settings" class="gearicon newnotification"> </span> </span> <span class="separator">|</span> <form method="post" action="/logout" class="logout hover"> <input type="hidden" name="uh" value="zoimwqbhhl59526448277e691374c3d0bc47706bb35d0045b9"> <input type="hidden" name="top" value="off"> <a href="javascript:void(0)" onclick="$(this).parent().submit()">logout</a> </form> </div>
i've tried setting each element block , floating right, isn't working. i've tried setting them display: table-cell; , aligning it, isn't working either.
can me this?
#header-bottom-right { display: block; float: right; } #header-bottom-right .separator { display: none; }
this pretty unrefined approach, it's starter. there's plenty of room smoothing out rough edges if want continue approach.
Comments
Post a Comment