Alternatives for CSS floats for email clients [closed] - html

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 5 years ago.
Improve this question
I'm trying to build a HTML email using foundation for emails which seems to have worked well however, I have discovered that outlook 2007+ doesn't like floats, does anybody know of a good alternative?
At the moment my elements are full width instead of floating to the left/right as they should!
Many thanks

I have done a few email marketings in the past months and I can say to you that the best way to build an email marketing is by having some notion of tables and spacers.
Here is a link for a basic tutorial about what I'm saying: Simple Steps For Email Marketing
An email marketing is basically a sequence of table inside tables with a few blank tds usually by the class of spacer.
So here goes some tips that will make it work across all email clients having the tutorial I sent in mind, although I will state that I have never used foundation:
You will need to structure every part of your email inside tables.
Work with all your CSS inline.
Get used to creating spacer (blank tables) to simulate margins that you may then hide in mobile versions.
You need a service that lets you simulate how your email will look in every platform.

Related

Are HTML tables still the way to go? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 4 years ago.
Improve this question
AFAIK people create their own table-like-components and the use of the good old HTML tables is kind of "outdated". Now I'm at the point where I would need a table for my vuejs application. I'm using bulma and the doc states this:
Table
The inevitable HTML table, with special case cells
The "support" badges below that title state that there isn't much support for it (only variables) and the text itself sounds like "well... since so many not-up-to-date-people want it, here, take it".
Should I rather go the "unordered list" way or something else? Like creating a component to represent a row and a component holding the table together? I'm not asking for vue specifically, but for a rather "modern approach" and how to do something like that properly.
The table element is still the correct way to provide tabular data in a semantically correct way in HTML. So if you use it semantically correct it is fine and not outdated per se.
However having that in mind, it might be a valid decision for you to go with new approaches like CSS Grid if that helps you to faster and more user friendly accomplish the creation of new Elements on your website, as the end-user should always benefit from your decisions.

How do i write responsive emailer [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I am facing problem to make image responsive in Newsletetter means HTML Email.
I can make that image responsive in Browser but failed to do when I send that HTML as emailer into outlook version. That emailer needs to be responsive in mobile and tablet as well.
Though your question is really broad, I will try to give you information to get started.
Email templates is HTML from back in the 90s. That means, you create code, meant to work on prehistoric browsers (You can test your templates in IE6, or Microsoft Word for example. If it works in there, you've made a pretty good template).
Above information straight away proves to be the problem with what you are asking. How are you going to make something responsive, from the time that responsive wasn't in any way connected to the web?
Though responsive didn't exist back then, max-/min-width did exist back then, which will probably be the way to go.
For some examples you might want to check out this link (Zurb Responsive Email Templates) or this link (HTML Email Boilerplate).
Apart from that, we aren't really able to help you, given that you haven't shown us the work you have done so far.
Edit: And tagging it CSS3 is also not very handy, since I don't think ANY email client supports it.

Printing the content of an email marketing [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 4 years ago.
Improve this question
I have created an email marketing.
A different HTML with styles inline and all good practices of email marketing creation (that are very different from usual web development practices).
After struggling a little bit with this, I had a good html to be sent by email.
One problem, though... The people that receive the email will have to print its content and bring it back to me.
The best way I found was to select the content of the email and print it, but the content loses its styles, colors, etc.
I would like to know if there's a better way to print the email content. Maybe a link with some css... I really don't know.
As I didn't find clear info on this subject on the web, any help will be appreciated!
Thanks in advance!
Email design is hard enough without trying to make it print friendly as well. If the need to print is common practice for you, I would suggest including a hyperlink somewhere in your email to a web hosted version that is print friendly.
If it is something like a coupon they are printing, you could also take that opportunity to customize it more, add the fine print or any other info you'd like to omit from the email itself.

When to use Foundation/Bootstrap or custom css? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
So this has been a topic of debate between me and another coder. We are using foundation for a project and he really likes following the system they provide. I like to venture out when it doesn't fit exactly.
An example was this was when I was doing the login form and I wanted a singular sized view that looks the same on every view. I created a login form with a solid width and centered with margins. He comes back to the code and puts it in foundation with large/medium/small columns. The justification was that they know how to handle responsiveness better than us. I just wanted stack overflow's opinion on this one.
When is it right to use a css framework and when should you go outside of it?
I guess on big projects, where you'd like to use each an every feature that a css framework provides, you should go for it. Whereas in small websites, using Bootstrap/Foundation would be a slow-down factor.
Otherwise if you are confident with building a responsive framework yourself, you should go ahead. But, if you feel you aren't take help from others in the form of css frameworks.
This question is way too broad and there can be many possible answers. The above is just my point of view.
First of all if you already have experience with one framework, unless you're doing it for research stick with it.
Otherwise you could check this comparison.
Also if you're using a web framework like Rails, Spring MVC, etc, check the integration status between the both frameworks.
Another point you should care is the community, and in my humble opinion bootstrap wins (as my personal perception).

Designing layout in html [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I use CSS to stylize my pages. I use % style instead of using px values. However, since I need to add several elements of different sizes in different positions, I end up spending more time in designing the layout than the coding.
I tried using a WYSIWYG editor but it uses px style coding. Can someone help me with a solution so that I can design the layout quickly and proceed to real part? I use WordPad right now.
The best thing to do is practice more. Get better at coding them, and reuse parts from prior projects where it makes sense.
There is no WYSIWYG tool that will save you time, for most projects. They all write garbage code, because editing with such a tool is a bit ambiguous. It is up to you as a web developer to write your markup and styles in a way that will be interpreted correctly across many user agents.