View Full Version : Does text-align work on links?
lord_havoc
08-18-2007, 04:06 PM
I thought it did... but I can't seem to make my links align to the right on hover. Am I possibly doing it wrong or does text-align not affect links?
text-align can't be applied to elements with display: inline. Apply it to the block element containing your links, or make your links display: block.
lord_havoc
08-18-2007, 04:22 PM
What exactly is the difference between display:inline and display:block?
Spiritvn
08-18-2007, 04:32 PM
you should align the link to right and then format the link:hover, i think it works fine.
lord_havoc
08-18-2007, 04:39 PM
Well, I followed Twey's advice and it works but for some reason in a certain div I have the links done differently yet it reads the formatting for the other links. Basically the only difference is that I don't want these links to align while the rest do.
For the main links that are supposed to align right I have:
a:link, a:visited{
text-decoration: none;
color: gray;
background-color: transparent;
text-indent: .5cm;
text-align: left;
display: block;
}
a:hover{
text-decoration: none;
color: gray;
background-color: #404040;
text-align: right;
font-weight: bold;
display: block;
}
a:active{
text-decoration: none;
color: #000;
background-color: transparent;
display: block;
}
And then for these particular set of links that do not I have:
.holder a:link, .holder a:visited{
text-decoration: none;
color: gray;
background-color: transparent;
}
.holder a:hover{
text-decoration: none;
color: gray;
background-color: #404040;
}
.holder a:active{
text-decoration: none;
color: #000;
background-color: transparent;
}
And it still aligns right on that one page.
jscheuer1
08-18-2007, 06:58 PM
Css styles are cascading, that basically means that they are inherited down the chain of selected elements unless specifically contradicted. In IE however, they often would be more appropriately termed contagious. In most browsers, probably all but IE, if you define a style for a class of link, it overrides all other link selected styles and link selected pseudo styles for that class of links. In IE all of the selected pseudo styles must be defined for the new class to avoid bleed through of other selected pseudo styles. In most other browsers, if a new class is created, it may not inherit properties from the general selector for that element. So, it is best to define everything explicitly for all selectors, pseudo and otherwise, that could possibly be different via either omission or contradiction in other selectors.
Sound complicated? It is. Although it is possible (in theory) to correct your styles so that they would work as expected in IE and other browsers, it is far easier to do so if we have a link to the problem page:
Please post a link to the page on your site that contains the problematic style so we can check it out.
Style doesn't occur in a vacuum, it is made much more meaningful by the markup it is used with, and is much easier to troubleshoot at times by looking at the page and its code visually.
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.