1 reply [Last post]
Anonymous
Anonymous's picture
Guru
calgary,alberta
calgary,alberta

Hello

I have what seems like a straightforward task/experiment -

I have 3 links I want to display horizontally next to each other with a nice gap between each link. I would like to draw a box around each link, but I would like all 3 boxes aligned in the middle of the screen, so one box would be aligned dead in the middle of the page and the other two would be on either side with a nice gap in between the boxes.

TIA for any help.

Herbie

Tony
Tony's picture
Online
Moderator
Brisbane
Last seen: 4 min 33 sec ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Problem with boxed text positioning

Hi Herbie,
This might be close to what your after:

#bbox{width:100%; text-align:center;}
.lnk{width:220px; line-height:20px; height:20px; text-align:center; 
margin:2px 5px 2px 5px; border:solid 1px blue; padding:2px; text-decoration:none;}
<div id="bbox">
   <a href="#" class="fx">First link</a>
   <a href="#" class="fx">Another link</a>
   <a href="#" class="fx">the last link</a>
</div>

Hope that helps.