You mean your right-hand column is transparent...
What is simple to you is not necessarily simple to do in HTML/CSS. HTML and CSS are built around the idea that divs are stacked blocks. Overlapping is something that is rather tricky.
Instead of thinking of your design as having three rectangles with rounded corners (also tricky in HTML/CSS), think of it as a header with rounded corners, a left-hand sidebar with rounded corners, and a right column that is square at the top, butted against the header, and has rounded corners at the bottom.
Add your navigation items over the header (which has two colors in its background) and you should be fine. (Also note that, if you do it this way, your right-hand column can have an opaque background, simplifying your CSS work even further.)
Draw your blocks logically, where they work with HTML/CSS, not necessarily where the color changes are.
Thank you for the input. I will actually end up with 4 rectangles. The
header and navigation will both be the full width of the page with the two
columns underneath. I just have to export it with the absolute values then
use them images and reconstruct it in Fireworks.That takes time. My actual
question was more to find out if I was missing something that wouldn't let
it export my slice or if Fireworks just won't do it. To many times I have
found a work around only to find out later I should of made something a
background image rather than a foreground one or something simple like that.
I am fairly new and have found out if you don't cross your T's and do your
eyes something simple won't work the way I see in the tutorials I watch.
Thanks again for your input
Yes Transparent lol
Hmm...I like to use the slicing guides. These can be dragged onto the from the rulers. You can double-click on a guide to set its position exactly, so close is fine for the dragging action.
Then, set the slicing tool to snap to guides. This is a good way to make slices exactly where you want and that don't overlap.
These images aren't necessarily the best way to make the pages, though. I recommend this tutorial. The author uses Photoshop, but I ran through it with Fireworks and it works just fine.
Pixlor, I do use the guides and snap to guides for setting up the page. I
didn't know they could be double clicked and set to an exact position. That
will make things so much easier.
I looked over that tut on slicing. I get it now. It made me realize a big
flaw in my design process. I can also see where it will save me headaches
down the road. Good thing for me you are so intuitive on what I was doing.
Thank so much for giving me your time. You have helped me with my design
process more than you think.
I think it was the word "reconstruct" that made me say, "Hmmm...." Glad you liked the tutorial. I think it's wonderfully well-written.
Fireworks is your design tool and your graphics production tool.
Just as a home builder might design in Autocad but then turns to concrete, wood, nails and such to actually build, we need to turn to code when we build. Fireworks isn't what you use to build code. Not, that is, if you want to maintain some level of sanity.
We design in Fireworks because it's easy to produce - in graphics - the result you want to have when you do write your code. Your FW design is your blueprint, but it isn't your code-building material and FW isn't your code-building tool.