DB2

I was using below page structure for this blog.  The stucture is very simple and clear. It works well on auto-width mode. The css is easy to design and also easy to deal with different browsers. No much effort on keeping identical for different browsers. However there's hard thing for it, the fixed width with center mode. I could not have the right style sheet making it work well with this structure.

Now I have below structure. It's my balance on flexible style and clear page structure. I don't like too much level div there, it would cost more client resource and make the page fat. When I play with this structure, I took more effort on having it work out with different browsers.

More about the refine work please see Refine and add new features to my web site.

Flickr let you publish your photos in Flickr to an external site such as your own website.

• Can I put my Flickr photos on my website?
  

Exactly, it's that Flickr made your an flash which contains thumbnail of your photos, then you put this flash into your site. the photos in this flash would be updated dynamically.

I put following code generated by Flickr into my MT template. 

<!-- Start of Flickr Badge -->
<style type="text/css">
.zg_div {margin:0px 5px 5px 0px; width:117px;}
.zg_div_inner {border: solid 1px #000000; background-color:#ffffff;  color:#666666; text-align:center; font-family:arial, helvetica; font-size:11px;}
.zg_div a, .zg_div a:hover, .zg_div a:visited {color:#3993ff; background:inherit !important; text-decoration:none !important;}
</style>
<script type="text/javascript">
zg_insert_badge = function() {
var zg_bg_color = 'ffffff';
var zgi_url = 'http://www.flickr.com/apps/badge/badge_iframe.gne?zg_bg_color='+zg_bg_color+'&zg_person_id=83054260%40N00';
document.write('<iframe style="background-color:#'+zg_bg_color+'; border-color:#'+zg_bg_color+'; border:none;" width="113" height="151" frameborder="0" scrolling="no" xsrc="'+zgi_url+'" title="Flickr Badge"></iframe>');
if (document.getElementById) document.write('<div id="zg_whatlink"><a xhref="http://www.flickr.com/badge_new.gne"    style="color:#3993ff;" onclick="zg_toggleWhat(); return false;">what is this?<\/a><\/div>');
}
zg_toggleWhat = function() {
document.getElementById('zg_whatdiv').style.display = (document.getElementById('zg_whatdiv').style.display != 'none') ? 'none' : 'block';
document.getElementById('zg_whatlink').style.display = (document.getElementById('zg_whatdiv').style.display != 'none') ? 'none' : 'block';
return false;
}
</script>
<div class="zg_div"><div class="zg_div_inner"><a xhref="http://www.flickr.com">www.<strong style="color:#3993ff">flick<span style="color:#ff1c92">r</span></strong>.com</a><br>
<script type="text/javascript">zg_insert_badge();</script>
<div id="zg_whatdiv">This is a Flickr badge showing public photos from <a xhref="http://www.flickr.com/photos/83054260@N00">I need to follow my heart</a>. Make your own badge <a xhref="http://www.flickr.com/badge_new.gne">here</a>.</div>
<script type="text/javascript">if (document.getElementById) document.getElementById('zg_whatdiv').style.display = 'none';</script>
</div>
</div>
<!-- End of Flickr Badge -->