So I got dasBlog installed and was using and was very very happy. I got all excited and wanted to add an image. that was fine but then I had a big space in my text. So I used the align property to make it wrap. I finished my post and submitted it. That's when bad things started happening. The space for the image was there but the actual image wasn't. Not only that, when I right clicked where the image should be I got the properties for the image. Confused yet?
So in searching the web I learned some things. Align is deprecated for one. We use float now. Ok fine. . . it still doesn't work. I know for certain that I'm a victim of the absolute positioning phantom. I personally like a flow layout using a table but they'll probably deprecate that too! (Actually I don't think it's compliant with the disability standards) . So for the last two hours I've been messing around with every z-index in dasBlog. Yeah non of those worked too!
I don't know if my solution is any good and it's certainly open for debate. In my search I came across this site http://www.l-c-n.com/IE5tests/float2misc/ of course I didn't read it. I just looked for stuff that would affect FLOAT and I found CLEAR and DISPLAY. The display I used is inline-block. Frankly I'm confused by that one. Visual Studio isn't exactly a champion when it comes to CSS but it's ok. There is inline and block but there isn't an inline-block. having a black belt in cut and paste who am I to question?
in dasBlog.css I added:
clear:both;
display: inline-block;
to
.itemBodyStyle, .commentBodyStyle
so mine looks like this:
.itemBodyStyle, .commentBodyStyle
{
clear: both;
display: inline-block;
margin: 0px;
padding-bottom: 1em;
font-family: Verdana;
font-weight: normal;
}
essentially this clear the other floats and let's the image and text do it's wrapping thing.