"The Bicycling Guitarist" wrote...
: My markup is valid but ... when the window is shrunk, the
: text goes behind the image.
I haven't played with z-indexing things, but perhaps that's one
way to get things done. I hesitate to mention it, because of my
own lack of implementation, and I'll let others discuss that.
One way to get things done, involves placing everything in their
own <divcontainers. It's a bit more complicated than using a
table, though, so I'll just mention that using a fixed-width table
is the easiest way to do it.
....
<style type="text/css">
table, td { border:0px;padding:0px;margin:0px; }
</style>
</head>
<body>
<table style="width:800px;margin:0px auto;"><tbody><tr>
<td width="200"><!-- left_margin things go here --></td>
<td><!-- content goes here, set to a minimum width to the size of
the largest pic, then adjust the table width by adding up all three
columns, the goal is to consistently present all pages in the same
manner so the end-user doesn't see things jumping around --></td>
<td width="200"><!-- right_margin things go here --></td>
</tr></tbody></table>
: Can anyone suggest a way to fix this while keeping the same general
: layout it has now (nav buttons on left, image in center, h1 title text on
: right)?
:
: The page in question is at
www.TheBicyclingGuitarist.net/index.htm
A fixed width table will present scroll bars inside the browser when
the page shrinks below a the table size. You'll need to adjust the
column widths for the right and left sides above as needed.
: The advice from this and the other ciwa newsgroups have helped me
: improve my site a LOT over the years. Just today I replaced <p>
: with <divfor image captions on several pages throughout the site
: as recommended by Jukka in the stylesheets newsgroup (example at
:
http://www.TheBicyclingGuitarist.net...images2001.htm )
Something you may want to consider for the images page above,
involves employing a fixed width <divwith margins set to:
style="width:200px;margin:0px auto;" (change the 200px to the
appropriate image-width + 10 or 20 px.
: I'm asking about the specific problem of the <h1text sliding
: behind the image when the window is shrunk in the current layout
: and code arrangement. If somebody wants to suggest a "makeover"
: for my home page or any part of my site, I'm all ears. Thanks.
I took the easy way out on the <h1>text</h1sliding behind the
images.
Hope this helps.
--
Jim Carlock
