?
Solved

Why does DW8 display CSS horribly in it's preview window?

Posted on 2007-12-04
6
Medium Priority
?
245 Views
Last Modified: 2010-04-07
I'm not great with CSS so I often use a template to start my design layout and then add to it, however DW8 throws the CSS all over the place in it's preview window. It's fine when I preview the page, but it makes it extremly awkard trying to work in this software when it doesn't look how it does online. I don't want to have to rebuild my pages from scratch in order just to get them to view correctly in 8 but it's very tempting to do so.

Does anyone have any advice? Is DW CS3 the same? I'm using CSS Drives templates so the CSS is correct. Thanks
0
Comment
Question by:signpost2
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
6 Comments
 
LVL 1

Assisted Solution

by:rinnej
rinnej earned 450 total points
ID: 20404444
Adobe fixed preview issues with newer versions of  Contribute regarding CSS.  
I am currently using DW8 and have no problems with it but our older version of Contribute is almost impossible to use with CSS.  I guess I'm not helping you much, but in the trial version of Contribute everything worked fine.  I would say that DW CS3 would have the same issues resolved as well but cannot speak from experience.
0
 
LVL 70

Assisted Solution

by:Jason C. Levine
Jason C. Levine earned 450 total points
ID: 20405281
Hi guys,

Dreamweaver CS3 still has some issues with the Design view if you have a lot of floats and clears on divs.  It appears to me that it has to do with the width of the design view window being a little smaller than average browser size and that can move stuff all over.

I use CS3, so if you want to post a sample page, I can download it and load it up and send you a screenshot of it.
0
 

Author Comment

by:signpost2
ID: 20409913
Thanks for the replies.
I tried downloading http://www.dynamicdrive.com/style/layouts/item/css-fixed-layout-31-fixed-fixed-fixed/ to use as the basic template to my layout. It was in DW8 that I noticed that if I use this particular layout the design is all over the place but fine on a browser preview. I used this layout as I thought it would contain the correct styling standards so I can start my CSS off correctly.

I can and have built a similar layout in DW8 which does look correct...at the mo but I often find that as my site develops things move out of place and I have to constantly check in different browser windows, which I know isn't a bad thing but is confusing to work with.

I hope to upgrade to CS3 shortly, but just found it odd that these tutorials tell you how to layout a page correctly so that it validates but in DW it just looks odd.

My CSS isn't great, so it can be really disconcerting when it looks odd in DW.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 20413979
I took a look at that page and the CSS and the W3C validator has some problems with it:

http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A%2F%2Fwww.dynamicdrive.com%2Fstyle%2Flayouts%2Fitem%2Fcss-fixed-layout-31-fixed-fixed-fixed%2F

It may be that the CSS is not quite as valid as it should be and DW is having a hard time rendering it.  You might want to look for a different three column layout.
0
 
LVL 19

Accepted Solution

by:
v2Media earned 600 total points
ID: 20415998
You have to keep in mind that DW's design view does not use a standards based browser rendering engine, it's a proprietary engine. Upgrading to CS3 isn't advised if all you're looking for is improved css rendering. I find that some designs render better in DW8, some in MX2004 and a few in DW9.

If having DW render your templates accurately is an important aspect of your design process, then obviously you have to keep your designs within DW's css rendering capacity. I'd download the CS3 demo to see if your templates render any better before purchasing a full version.

What may be an advantage in upgrading is CS3's built-in templates. CS3 has a new 'File > New' dialog window that allows you to select for a wide range of layouts, both fixed and liquid. These templates can suit most projects, the code is OK and the css is well commented.
0
 

Author Comment

by:signpost2
ID: 20418644
Thanks for all your comments.
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Creating a CSS block that only applies to printing By default, all of your CSS applies to every possible view of your page - whether on screen, printed, landscape, touch-screen, or whatever.  You can, however, add CSS that only applies under certai…
This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

800 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question