Theodore Serbinski wrote:
Well the border part I've figured out... I just have a 1 x 768px image
that is set as the bg for the body this creates the shadow effect
perfectly.
I agree with the title image graphic being an <h1> as well no problems there.
But that graphic of the cable, whew still having trouble figuring out
the best bet for that image. The hard part is that it fades into the
blue and black bars.
Either I take this an entire big image and have it on top of the blue
and black bars with the content on top of that (the text) or I cut it
up into 3 slices, one for the bg of the black bar, blue bar, and the
white content area.
Thoughts?
ted
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
The problem with putting the shadows in the <body> is it makes the
layout fixed (you can't position with anything but pixels). I suggest
using 3 divs there; make all 3 relatively positioned, and shift the
first one to the left the width of the left shadow, the second one to
the right the width of the left shadow plus the right shadow, then shift
the third one back the width of the right shadow. Then just give the
first div the left shadow background with a background position of top
left, then second div the right shadow background with a background
position of top right, and the middle one a white background with black
borders (or you can merge the black borders into the shadow pictures).
As mentioned, the title should be an <h1>. For the cables, I suggest
surrounding the rest of the content minus the <h1> at the top in a
<div>, make that <div> relatively positioned with no offset, then slice
the cables starting just before the fade (so the left side of the
graphic contains the right side of the blue bars). Then absolutely
position a <div> with the cable graphic as a background image, in the
top right. Then simply give the rest of the elements a right margin
large enough to prevent the text from flowing under the cable graphic.
You might have to experiment here, because putting the right margin on
the element containing the bars will likely screw up the effect. It
might be better to mark up the text inside (probably with an <h2> for
the first bar, and a <ul> for the second bar), give them both no
backgrounds, and put the margins on them. You could also add padding to
the outer div that surrounds everything, but this will have the same
problems as adding the margins to all child elements. The advantage of
doing it this way is that the size of the padding is in one place,
making it easier to adjust.
You'll have to experiment to find the right way. Sorry if this is a bit
confusing, if you don't quite follow it, I can explain with examples
and/or diagrams.
--
http://www.mozilla.org/products/firefox/ - Get Firefox!
http://www.mozilla.org/products/thunderbird/ - Reclaim Your Inbox!
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
