CSS Text Wrap
Posted April 7th, 2005 @ 12:58pm by Erik J. Barzeski
Easy!
<div style="height:17px; width: 270px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 278px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 286px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 294px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 302px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 310px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 300px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 290px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 270px; float: left; clear: left"><span></span></div> <div style="height:17px; width: 230px; float: left; clear: left"><span></span></div>
I've often wished text wrap were possible in CSS, possibly by defining the corners or radii of objects (like the language used to define imagemaps). I suppose this solution will work until someone creates support for the better other way.
Posted 07 Apr 2005 at 8:48pm #
Hi Eric...
Why not do it the way Eric Meyer does it on his site? It seems like a lot less hassle!
Ragged Float
Posted 07 Apr 2005 at 9:10pm #
Just to clarify, I didn't have this stroke of genius myself...
I asked a friend how he'd do it and he pointed me to the Eric Meyer site!
Posted 08 Apr 2005 at 2:46am #
Matthew: The method Eric Meyer and I use are essentially the same. You either cut your actual picture up into stacked divs or you stack a bunch of blank divs. Neither is semantically nor implementationally better than the other.
Posted 08 Apr 2005 at 9:17am #
I think before you get the text flowing around the images, you should make it so that the page renders half properly in I.E. I know that you're a mac guy, and don't like PCs with I.E., but it's funny that after all your complaining about sites that aren't cross-platform compatible, your own site isn't cross-platform compatible.
Posted 08 Apr 2005 at 10:31am #
I can't speak for Erik but it's more common for people to complain that sites are not standards compliant, not cross-platform compatible. This page *is* standards compliant so the problem is WinIE is *not*.
Anyway, I'd call it "half properly" rendered in WinIE, I see 2 minor problems and one more significant one. Most obvious is the main body of the page appears below the right sidebar, probably due to WinIE messing up the float. The sidebar's orange partially overlaps some of the top right tags, probably because WinIE has a different default window padding (if so, this isn't really a standards problem and may be resolvable by setting the body margins and/or padding to 0 0 0 0 to make them the same in all browsers). The non-cosmetic problem is the TypePad portion of the page just below "Post a Comment" does not display at all; it looks like it's not running the embedded javascript.
Posted 08 Apr 2005 at 4:16pm #
In Erik's entry about the Master's site not supporting macs, he says:
Correct me if I'm wrong, but it seems that the technology he's referring to has nothing to do with web standards. It has to do with a site not supporting Macs, even though it would be "easy."
Now, don't take this the wrong way- I personally don't care whether or not his site renders as he thinks it should in WinIE. I use WinIE at work because they don't allow me to install anything else.
I used to work as a tech support rep for a large independent study website that supported both macs and PCs. I've encountered several places where Macs were non-compliant in their implimentation of javascript, and we caught those noncompliance issues and worked around them. Simply saying that the browser is "non-compliant" is not a proper excuse for completely ignoring it, no matter what side of the fence you sit on.
Posted 08 Apr 2005 at 5:04pm #
OK Jo-Pete, you're wrong. If the Masters site used web standards, they wouldn't do all the browser detecting and all that crap that prevents Safari from working (though I've forced it to work just by digging around and getting the proper URLs).
The technology to which I'm referring has everything to do with Web standards. They've specifically blocked Safari from even getting to certain pages.
Win IE is a piece of crap when it comes to web standards. That much is very clearly and widely understood.
Posted 14 Aug 2009 at 11:31am #
Masters doesn't follow ANY web standards.
IE was never meant to be a browser. Something to aqllow you to install Chrome or Firefox