5

I have table with this markup:

<tr id="main_nav">
    <td style="width: 100%" colspan="2">
        <a>Link1</a>
        <a>Link2</a>
        <a>Link3</a>                            
    </td>
</tr>

I need to set padding to these links, but I can't make it to work... CSS:

#main_nav a {
    color: #fff;
    font-weight: bold;  
    padding-left: 1em;
}

What I've tried: wrap link into p tag, span tag, add css display block, display table, add style with padding to link. Can not wrap each link in <td> tag!

Edit: Tried margin instead of padding, no luck.

2

6 Answers 6

9

I successfully get around this issue by setting a large border to the same colour as the background.

border: 10px solid #fff;
2
  • This is genius!
    – Seega
    Apr 26, 2021 at 9:40
  • @Seega thanks for that, you are very kind.
    – Mike Poole
    Apr 26, 2021 at 13:24
2

Put <a>Link1</a> within a div, then set the div padding.

If it still doesn't work, try to change the width of the divs, like here: http://jsfiddle.net/XWLv6/1/

3
  • 1
    @Morpheus Can you add a jsfiddle example?
    – ParPar
    Dec 11, 2012 at 9:09
  • It's working when I am testing in browser. It doesn't in outlook.
    – Morpheus
    Dec 11, 2012 at 9:15
  • I want these links to expand with table, but your example gave me idea to use percentage width and it worked :) Thank you :)
    – Morpheus
    Dec 11, 2012 at 9:28
1

Quickest way to consistently "pad" something in email is to just throw a couple of &nbsp; in there. Seems like bad practice I know...

Otherwise put them into their own table with an empty col as the padding for consistent results.

0
0

add display:block; to the #main_nav a

0
0

You must put your CSS inline for all elements in an HTML email. Example:

<a style="color:#fff;font-weight:bold;padding-left:1em;">Link1</a>
0
0

if it's just matter of appearance this is what I did.

border-right-width: 177px;
border-left-width: 177px;
border-top-width: 10px;
border-bottom-width: 10px;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.