HTML & CSS
Here I am trying to learn the wonderful ways of html emailing using inline styles. Does anyone know why there are spaces between the 3 header buttons ( visit our page / register / ask a question )?
They were originally all together but I changes the colours and now there is this spacing:
You've set the table to have a width of 100%, and you've then specified the width of each individual cell. What happens there is that, where the total widths of the cells added together come to a different width than the overall table, the cells are enlarged/shrunk proportionally ... and that's what's happened here. The table containing the three header buttons takes a width of 605px, but the three cell widths together add up to 580px ... so there's an extra 25px to be spread between them, which is giving those gaps. The easiest way to fix it would be to give the third cell a width of 245 (the 220 you want plus the spare 25) ... or to give the table a width of 580px instead of 100%
Why is the table taking a width of 605px? Because you've set it to 100%, which means it fills the available width. And the available width is defined by the cells beneath it, which are a 10px-wide spacer column and then a 595px-wide image.
Nicely explained, and sorted, many thanks - Glad css has replaced the use of tables!!!
This topic is now closed. New replies are no longer allowed.