Forum Moderators: not2easy
Thanks for posting this, since you're sharing something with others I hope you don't mind if I take the opportunity to allow all of us to learn a few things left and right.
Please do not get scared off or see it as negative criticism, I'm only trying to teach a few things I learned in the past.
<div id="div_container" class="div_container">
As a reminder: a class can occur any number of times in the html and is selected by ".class"; while an id must be unique in the html file and is selected by "#id".
If all your images have the same size you probably can loose the size on the <img> tags and put them in the css.
border="0" on an image used in a link isn't needed when you can set borders to 0 in CSS. You can even do it globally to never be bothered with them anymore:
a img {
border:0;
}
Since you don't use the thumbnail class you can drop them too. Once you can select them through their parents it's smart not to repeat the class all over the place. I did that in the beginning of my CSS learning as well, took me some time to accept it's simply not needed, nor all that useful.
Since you have inline elements (<a>, <img>), you can let it flow without line-breaks to take up whatever space the window allows and wrap like text does.
While it's probably there for some IE side effect (I didn't test it yet), the "position:relative" isn't doing anything for standards compliant browsers. "position:static" is the default: it puts the element in it's normal spot in the flow.
"position:relative" changes that as it allows the element to be nudged without forcing the other elements around it to also shift about due to that nudging.
"position: relative" in my experience is mostly used without the nudging being used at all. I guess most do it for avoiding some IE bugs, but those fixes really ought to go in a conditional comment if they are indeed needed. Or because they don't know it's not the default and is only useful in conjunction with some left/right/top and/or bottom statements as well.
