Menu
I have a couple of links that have a margin-left of 3px. These links are underlined and look like that:
<a href='#'>
test
</a>
Unfortunately, there are spaces inside the link and I'm not able to remove these space since I don't have access to the HTML code. These spaces are also underlined, which I'm not happy with. Is there any way to remove them without changing the HTML?
Here is a fiddle that shows my problem: http://jsfiddle.net/e8quz/
Update:
Here is a picture, what I want it to look like:
266
There is no CSS for applying an underline ( text-decoration: underline; ) only to individual words in a multiple-word element. The best way would be to wrap each word in a span (not the spaces, just the words) in spans and apply underline to those spans.
In the following “Font” dialog box, switch to “Advanced” page. Select “Raised” in the “Position” box, and enter a specific number you want in the “By” box. For example, here we enter “6 pt”. Note that the larger the value we enter, the more space there will be between texts and underline.
Complete HTML/CSS Course 2022 To underline a text, you can also use the style attribute. The style attribute specifies an inline style for an element. The attribute can be used with the HTML <p> tag, with the CSS property text-decoration. Just keep in mind, the usage of style attribute overrides any style set globally.
The spaces come from the line-breaks (well-known from the display:inline-block problematic).
So make your a elements display: block and float them to the left.
DEMO
PS: The display:block is "redundant", as float normally already sets the display property of the respective element to "block". But it do no harm ...!
68
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
