Inline styling with hiccup

Question

I have an html document that I generate with clojure hiccup. When I send the file as an attachment to an email, the css gets stripped out. The css is external and being referenced in the head of the file like below:

[:head
  [:title "My Title"]
   (include-css "css/mycss.css")]

I heard mail servers strip out all external css so it does not interfere with theirs. One solution I was able to fin was to do an inline styling. For example if I have the below html, how do I perform inline styling on it.

[:thead
   [:tr [:th "First column"] [:th "Second column"] [:th "Third column"]]]

Additionally, feel free to suggest if there is a better answer to what I want to do. Thanks!

Answer 1

hiccup supports attributes right out of the box with the {} syntax, so you could simply use this for settings style attributes on elements easily, e.g., [:p {:style "color:#E0E0E0"} "My paragraph"] will put the color on the paragraph. But I guess in your case, it might be more convenient to put the general style definitions in the head element, using the style element. hiccup supports :style for this as one would expect, e.g.

[:head [:title "My title"]
       [:style "body { padding-top: 60px; }"]].