Skip navigation
CouponPages.Com
CouponPages.Com Calculating status...
Currently Being Moderated

Is there a way for export to create rounded corners?

Jun 30, 2012 9:27 AM

Tags: #export #css #fireworks #cs6 #rounded #corners

I love creating layouts with Fireworks, but it always bothered me that it didn't recreate any rounded corners.

 

When CS6 came out with the CSS Properties window, I was happy to see that the CSS in the Properties window faithfully created my objects with rounded corners, so I had high hopes that the regular export would include this markup... but it didn't.

 

My current work-around seems very frustrating.  I export my file as HTML with CSS images... I get a perfectly rendered page with one exception... the corners are still square.   Then, I go back to Fireworks, open the CSS Properties window, then cut and paste the tags for the corners one by one into the CSS file.

 

It seems to me with such heavy emphasis on CSS integration, that  the export function should include the this code too.

 

Am I doing something wrong?  Or is this still an unsupported feature?

872 Views   6 Replies   Latest reply: CouponPages.Com, Jul 2, 2012 8:06 AM
 
Replies
  • Jim_Babbage
    Currently Being Moderated
    1. Jim_Babbage,
    Jun 30, 2012 9:46 AM   in reply to CouponPages.Com
    Report

    Use the CSS Properties panel to extract and copy CSS for the selected object on the canvas. It has no integration with the CSS and Images export workflow OR the HTML and Images export workflow (the latter of which produces a rigid, image-based, html table layout). HTML and Images export is really only suitable for clickable prototypes. CSS and Images export is really only suitable if you like re-writing all the CSS to match your normal workflow.

     

    General workflow:

     

    1) Add effects to vector shape (corners, drop shadow, glow, gradient fill, border, opacity, etc..)

    2) Open CSS Properties panel. CSS properties for selected object are displayed.

    3) Click the Copy All button in the panel.

    4) Switch to Dreamweaver or your preferred web editor.

    5) Paste the CSS into the desired class, id or element rule.

    6) View in Live View or Preview in Browser to see results.

     

    HTH

     
    |
    Mark as:
  • CouponPages.Com
    Currently Being Moderated
    2. CouponPages.Com,
    Jun 30, 2012 3:44 PM   in reply to Jim_Babbage
    Report

    Hi Jim,

     

    That's my workflow right now.  It just seems strange that the export with Images and CSS option builds a nearly pixel perfect version of my layout... Yet it leaves out attributes like rounded corners.

     

    For a simple layout, it's not too bad cutting and pasting from the CSS properties window, but it's a bit odd that it leaves out formatting in the first place.  The bigger problem is if I change my layout, I just swap out my CSS and I have to re-edit the CSS to put back the rounded corners.

     

    I'm hoping there will be an update to enable this.  Since i like rounded corners, it will save lots of time editing code.

     
    |
    Mark as:
  • Jim_Babbage
    Currently Being Moderated
    3. Jim_Babbage,
    Jun 30, 2012 8:06 PM   in reply to CouponPages.Com
    Report

    No one can say for sure what changes/improvements will occur, but considering little has been done with the CSS and image export in two releases, I wouldn't hold my breath. The panel is far easier for Adobe to update quickly as specs change. The export workflow though, is baked right into FW.

     

    Cast your vote, though by requesting this feature be added, by using the Adobe wish form. Without feedback to the wish form, the engineering team isn't aware or what users want changed.

     
    |
    Mark as:
  • CouponPages.Com
    Currently Being Moderated
    4. CouponPages.Com,
    Jun 30, 2012 8:10 PM   in reply to Jim_Babbage
    Report

    Good idea.  As a developer I frequently have clients ask me why I don't have a specific feature and more often than not, my answer is "I didn't know you wanted it".

     

    That said, where can I find the Wish Form?

     
    |
    Mark as:
  • crystalprismworld
    Currently Being Moderated
    5. crystalprismworld,
    Jul 1, 2012 11:45 PM   in reply to CouponPages.Com
    Report

    Thank you for posting this question and obtaining an answer..I had the same questions.

     

    Thx

     
    |
    Mark as:
  • CouponPages.Com
    Currently Being Moderated
    6. CouponPages.Com,
    Jul 2, 2012 8:06 AM   in reply to crystalprismworld
    Report

    I took Jim's advice and posted it in the Adobe Wish Form.  Since Adobe hasn't updated the CSS Export since CS4, I think it would be great if as many people as possible let them know this is something useful by posting this in the Wish Form too.

     

    Here's the URL for the Wish Forum:

     

    https://www.adobe.com/cfusion/mmform/index.cfm?name=wishform

     

    Perhaps if enough people asked, they will consider it in a future upgrade.  Since the CSS Properties includes most of the formatting for any given object, it shouldn't be a big deal for them to export  those properties in the CSS Export.  It may be possible the only reason it doesn't is that nobody asked.

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points