Alternative for middle aligning

@KDLAMar 09.2007 — #Select a padding setting which "fakes" your text being in the middle of the block:

<i>
 </i>&lt;ul&gt;
 &lt;li style=" display: block; width: 12em; [B]font-size: .8em; padding: .4em .1em;[/B] border: 1px solid #000;"&gt;Normal Link box&lt;/li&gt;
 &lt;li style=" display: block; width: 12em; [B]font-size: .8em; padding: .4em .1em;[/B] border: 1px solid #000;"&gt;Really, Really Really Long Name Link box&lt;/li&gt;
 &lt;/ul&gt;

@bp_travisauthorMar 09.2007 — #Sample Code:

CSS

[CODE]
 ul{
 list-style:none;
 margin: 0;
 padding: 0;
 }
 
 #menu {
 width: 200px;
 height:auto;
 margin: 0px;
 float: left;
 }
 
 #menu li a {
 height: 35px;
 voice-family: ""}"";
 voice-family: inherit;
 height: 27px;
 text-decoration: none;
 font-weight: bold;
 font-family:Comic Sans MS;
 } 
 
 #menu li a:link, #menu li a:visited {
 color:#DFD61A;
 line-height:35px;
 margin-left:auto;
 margin-right:auto;
 display: block;
 background:  url(images/s_link_off_green.jpg);
 height:40px;
 font-size: 12px;
 }
 
 #menu li a:hover{
 background:url(images/s_link_on_blue.jpg);
 }[/CODE]

HTML

[code=html]
 <ul>
 <li><a href="#">Staff</a></li>
 <li><a href="#">About Off-Lead</a></li>
 <li><a href="https://www.barkleigh.com/OL_subscribe.html">Subscribe</a></li>
 <li><a href="mailto:[email protected]">Contact US </a></li>
 <li><a href="#">Products,Books,DVD's</a></li>
 <li><a href="#">Articles</a></li>
 <li><a href="https://www.barkleigh.com/mailing.html" target="_blank">Join the Mailing List</a></li>
 <li><a href="#">Trainer's Round Table</a></li>
 <li><a href="#">Advertising</a></li>
 <li><a href="#">Learning Opportunities & Seminars</a></li>
 </ul>
 [/code]

Thanks

Alternative for middle aligning

3 Comments(s) _↴

Also in #CSS _↴

Success!

Social

Version

Alternative for middle aligning

3 Comments(s) ↴

Also in #CSS ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

3 Comments(s) _↴

Also in #CSS _↴