By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,738 Members | 1,080 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,738 IT Pros & Developers. It's quick & easy.

Unusual floats?

P: n/a
With CSS, is it possible to produce, without making a mess, the kind of
layout shown (crudely) by

http://gavelcade.com/mockup4.gif

?

The text in the panes on the left and right should wrap around the
superimposed feature boxes in the center.

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

Jul 20 '05 #1
Share this Question
Share on Google+
4 Replies


P: n/a
"Harlan Messinger" <h.*********@comcast.net> wrote:
With CSS, is it possible to produce, without making a mess, the kind of
layout shown (crudely) by

http://gavelcade.com/mockup4.gif

?

The text in the panes on the left and right should wrap around the
superimposed feature boxes in the center.


It's possible, but not easy. It would require using dummy blocks floated
in the 2 main columns to cause the text to wrap around, and then
absolutely positioning the feature boxes in the center.

--
Spartanicus
Jul 20 '05 #2

P: n/a
Spartanicus <me@privacy.net> wrote
"Harlan Messinger" <h.*********@comcast.net> wrote:
With CSS, is it possible to produce, without making a mess, the kind of
layout shown (crudely) by

http://gavelcade.com/mockup4.gif

The text in the panes on the left and right should wrap around the
superimposed feature boxes in the center.


It's possible, but not easy. It would require using dummy blocks floated
in the 2 main columns to cause the text to wrap around, and then
absolutely positioning the feature boxes in the center.


Yeah. Your HTML template should look something like this:

<body>
<div id="header">...</div>
<div id="feature">...</div>
<div id="sitemap">
<div class="featurespace">...</div>
...
</div>
<div id="main">
<div class="featurespace">...</div>
...
</div>
</body>

Using:
#feature to horizontally absolutely position.
.featurespace to set width and height to match #feature.
#sitemap .featurespace floated right.
#main .featurespace floated left.

--
Karl Smith.
Jul 20 '05 #3

P: n/a

"Karl Smith" <go************@kjsmith.com> wrote in message
news:3d************************@posting.google.com ...
Spartanicus <me@privacy.net> wrote
"Harlan Messinger" <h.*********@comcast.net> wrote:
With CSS, is it possible to produce, without making a mess, the kind of
layout shown (crudely) by

http://gavelcade.com/mockup4.gif

The text in the panes on the left and right should wrap around the
superimposed feature boxes in the center.


It's possible, but not easy. It would require using dummy blocks floated
in the 2 main columns to cause the text to wrap around, and then
absolutely positioning the feature boxes in the center.


Yeah. Your HTML template should look something like this:

<body>
<div id="header">...</div>
<div id="feature">...</div>
<div id="sitemap">
<div class="featurespace">...</div>
...
</div>
<div id="main">
<div class="featurespace">...</div>
...
</div>
</body>

Using:
#feature to horizontally absolutely position.
.featurespace to set width and height to match #feature.
#sitemap .featurespace floated right.
#main .featurespace floated left.


I guess this is what we call "tag soup". :-) But I'll give it a try. I'll
only be using this layout for the home page. All the others are much more
straightforward.

Jul 20 '05 #4

P: n/a

"Karl Smith" <go************@kjsmith.com> wrote in message
news:3d************************@posting.google.com ...
Spartanicus <me@privacy.net> wrote
"Harlan Messinger" <h.*********@comcast.net> wrote:
With CSS, is it possible to produce, without making a mess, the kind of
layout shown (crudely) by

http://gavelcade.com/mockup4.gif

The text in the panes on the left and right should wrap around the
superimposed feature boxes in the center.


It's possible, but not easy. It would require using dummy blocks floated
in the 2 main columns to cause the text to wrap around, and then
absolutely positioning the feature boxes in the center.


Yeah. Your HTML template should look something like this:

<body>
<div id="header">...</div>
<div id="feature">...</div>
<div id="sitemap">
<div class="featurespace">...</div>
...
</div>
<div id="main">
<div class="featurespace">...</div>
...
</div>
</body>

Using:
#feature to horizontally absolutely position.
.featurespace to set width and height to match #feature.
#sitemap .featurespace floated right.
#main .featurespace floated left.


I guess this is what we call "tag soup". :-) But I'll give it a try. I'll
only be using this layout for the home page. All the others are much more
straightforward.

Jul 20 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.