Try using rectangle tool and not rounded rectangle and also avoid the transparent background.
1 person found this helpful
Hey RJ, I was able to create it no problem using either Rectangle Tool with 10px roundness (left), or the the Rounded Rectangle Tool (right).
See live example here with drop shadow.
Download original sample file here.
Couple of tips to remember.
- Use .jpg (100 quality) or png for each of the slices for them to show 'smoothly'. (I notice your screen example uses .gif, and it's not recommended when drop shadows are used)
- For the top/bottom make sure the slice extends just a tab bit beyond where the 'corner' on the shape occurs. Thats why your seeing a little 'extra' graphic on your edges.
hope this helps
The issue turns out to be the use of a transparent background. Everything else I had done was "technically" ok. Once I gave the canvas a color in Fireworks, the resuting page looks fine.
I am not sure if this is documented anywhere, but it does seem like it would be worth mentioning in a Wiki or KB about CSS Export.