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
Offline
Moderator
Brisbane
Last seen: 15 hours 47 min ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5342
Points: 2963

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.