I'm working on some pretty stylistically involved web pages and would
like to keep my html (or haml) as clean, DRY and semantic as possible.
I'm looking for any suggestions on how to best accomplish accomplish
these cleanly. Thank you in advance.
As cross browser interoperability is a must. Unfortunately things
like :before and :after can't be relied on to work in IE6 or IE7. I
have found myself with an element such as:
<input class="fancy" type="text" id="firstlastname_input"
name="firstlastname" value="" />
and had to invent a new, non-semantic element around it like:
<span class="fancyinput_holder><input class="fancy" type="text"
id="firstlastname_input" name="firstlastname" value="" /></span>
to allow me to create more complex nested beveled borders. It seems to
me, that it would be much more semantic to say in sass:
input.fancy
/* input styling */
background: ...
padding: ...
border: ...
haml-create-parent-element: span
/* parent span styling */
background: ...
padding: ...
border: ...
than to invent a fancyinput_holder class for what seems like purely
stylistic reasons. That way sass can tell haml to generate an extra
span around the input that matches the selector.
Additionally the web site I'm working on makes heavy use of drop
shadows. Researching this online Safari supports the standards
compliant way of doing this. IE, of course, supports a proprietary way
of doing this, but it, fortunately doesn't interfere with the Safari
compatible solution. There is a hack to get Firefox to simulate a drop
shadow, but it has to do a particularly ugly tap dance around Safari,
*AND* (worst of all) it requires the style sheet to contain the text
of any string from the html that is to have a drop shadow as the
content of a :before pseudo-class. This seems to be even more messy.
(details here:
http://www.workingwith.me.uk/articles/css/cross-browser-drop-shadows
)
Even if sass can't eliminate the messiness of the css hack, it would
be nice if I could say something like
=shadow
haml-insert-element-before: span
content= !haml-parent-element-contents
the syntax is, of course rough... and I certainly don't want to
suggest someone waste their time implementing something that there is
already a better way to do, but I'm looking for good solutions to
these two issues.
Looking forward to your input,
Thanks,
-Loren
--
You received this message because you are subscribed to the Google Groups
"Haml" group.
To post to this group, send email to h...@googlegroups.com.
To unsubscribe from this group, send email to haml+unsubscr...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/haml?hl=en.
