Blog: Preview of ul-tags

Öppet brev till Blogger support, självklart formulerat på engelska...

Dear Blogger support!

I use http://www.blogger.com/post-create to post and the Blogger Template Style "Son of Moto (Mean Green Blogging Machine variation)" with mild changes. I've found a problem (in my eyes) with that template. Should I report my suggested corrections to you or to the original template author?

My first suggestion is to Blogger anyway. When previewing a post it may seem all fine but yet the result after posting may be very different. The reason for this is that the preview does not use the CSS template. I haven't seen this documented as neither a feature nor a bug. Actually this is an even bigger problem when it's template changes that are previewed. I would expect the result to be the same as when republishing with the template changes. To me it wasn't. During preview the font was gigantic (giving all kinds of problems). I published anyway and there was then no problems what-so-ever.

Secondly, I have a suggestion to the above mentioned "Son of Moto" template. In this style there is an ul override.

ul {
  margin: 0 0 25px 0; 
  }

At least in IE 6.0 this setting makes the bullets disappear, cancelling almost the entire effect of the ul tag. That may have been the accurate intention but to me it looks like an error, where the bottom margin should instead have been the left.

I came to like the ul style below. Setting top and bottom negative is because I use the Blogger "linebreak -> br" feature. That feature does however not take into account that the ul-tag has linefeed built-in already. With negative margin I cancel those efficiently.

ul {
  margin: -1.2em 0 -1.2em 25px;
  /* Negative values cancel the built-in top+bottom 
  linefeeds of ul-tag. Unfortunately dependant on 
  em and not line-height itself. */
  }

Tampering with this style I found that the sidebar was affected negatively. Simply corrected by resetting the margin in the sidebar ul style.

#sidebar ul {
  margin: 0 0 0 0; /* Cancel margin from ordinary ul. */
  padding-left: 0;
  padding-top: 3px;
  }

You can see the result of these changes in my blog if you're fast. My template is subject to further enhancements as time passes. There are other HTMl structures, apart from ul, that have built in linefeed. You might want to add a help topic note on this subject, hinting this workaround for everyone using the implicit br.

Thank you for your consideration,
   JAG