Tycoon Talk
Become a Big fish!
The number 1 forum for online business!
Post topics, ask questions, share your knowledge.
Tycoon Talk is part of Freelancer.com - find skilled workers online at a fraction of the cost.

CSS Forum


You are currently viewing our CSS Forum as a guest. Please register to participate.
Login



Reply
How to get the underlines / borders to appear just under text width?
Old 08-18-2011, 04:55 PM How to get the underlines / borders to appear just under text width?
Extreme Talker

Posts: 246
Name: Patric
Trades: 0
Hi there,

so on these pages on the left sidebar, I've got the active / hover state so that there's the blue border on the bottom of the item. The problem is that it's going beyond the actual width of the text that it's highlighting.
http://www.moko.com.php5-21.websitet...m/?page_id=107

How can I have it so that it goes just under the width of each text item? Similar to the main nav at the top of the page?

Any help would be greatly appreciated. Kind of in a bind here and can't quite figure it out.

Thanks
Reckoner is offline
Reply With Quote
View Public Profile
 
 
Register now for full access!
Old 08-18-2011, 05:45 PM Re: How to get the underlines / borders to appear just under text width?
serandfae's Avatar
Do the "Evil Nanner" !!!

Posts: 9,007
Name: Tim Daily
Location: Apex, NC, US, Sol 3
Trades: 0
Several ways you could do it, quickest would be to restrict the width of the link itself to the width of the text with overflow:hidden; . If there were more than two links in question then I might suggest other methods, but in this case quick 'n' dirty will work.

tim
__________________
SEO "experts" smell like Big Fish_|_
Please login or register to view this content. Registration is FREE


Please login or register to view this content. Registration is FREE


Last edited by serandfae; 08-18-2011 at 05:46 PM..
serandfae is offline
Reply With Quote
View Public Profile Visit serandfae's homepage!
 
Old 08-18-2011, 05:47 PM Re: How to get the underlines / borders to appear just under text width?
lizciz's Avatar
Super Spam Talker

Posts: 807
Name: Mattias Nordahl
Location: Sweden
Trades: 0
You have given them a fixed width of 80px, so you might want to remove that.
Also, when you remove the width, the border will be too short, because there is a 40px right margin that "pushes the <a> element away". So you might want to remove that too.
Thirdly, when the right margin is gone the border will stretch too far, because you've set the <a> tags to display as blocks, which will make them stretch as far as possible. So remove that too or change it to something else, like inline or inline-block.

That should do the trick!
__________________
Your answers will only be as good as your question. Formulate it well and give all the necessary information.
lizciz is online now
Reply With Quote
View Public Profile Visit lizciz's homepage!
 
Old 08-18-2011, 05:49 PM Re: How to get the underlines / borders to appear just under text width?
chrishirst's Avatar
Missing! presumed drunk.

Posts: 42,371
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
Use the text-decoration property instead of the bottom border
__________________
Chris. ->>
Please login or register to view this content. Registration is FREE
<<-

A foolish consistency is the hobgoblin of little minds
Thought for today:- Is SEO the only industry where all the cowboys are Indians?
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Old 08-18-2011, 05:59 PM Re: How to get the underlines / borders to appear just under text width?
Extreme Talker

Posts: 246
Name: Patric
Trades: 0
Er, edit. Thanks for the replies guys, the display: inline actually was all I need.

I have been really bad about overlooking stuff like that lately.

Thanks.

Last edited by Reckoner; 08-18-2011 at 06:22 PM..
Reckoner is offline
Reply With Quote
View Public Profile
 
Old 08-18-2011, 06:03 PM Re: How to get the underlines / borders to appear just under text width?
chrishirst's Avatar
Missing! presumed drunk.

Posts: 42,371
Name: Chris Hirst
Location: Blackpool. UK
Trades: 0
Right click -> View Source -> search for the anchor text of a link -> read the class name and/or the ID of the parent
__________________
Chris. ->>
Please login or register to view this content. Registration is FREE
<<-

A foolish consistency is the hobgoblin of little minds
Thought for today:- Is SEO the only industry where all the cowboys are Indians?
chrishirst is offline
Reply With Quote
View Public Profile Visit chrishirst's homepage!
 
Reply     « Reply to How to get the underlines / borders to appear just under text width?
 

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off





   
RSS Feed  Feeds: RSS   JS   XML
RSS Feed  Feeds for this forum: RSS   JS   XML



Page generated in 0.27787 seconds with 12 queries