Expression > Forums Home > Expression Studio Forums > Expression Web and SuperPreview > Design tab rendering is all over the place
Ask a questionAsk a question
 

QuestionDesign tab rendering is all over the place

  • Wednesday, November 04, 2009 12:47 AMKevin12853 Users MedalsUsers MedalsUsers MedalsUsers MedalsUsers Medals
     
    Hi
    I have just started using the trial version of EW3. I have created a simple page layout using Divs. The page contains a header; top nav; left nav and page content. The page is fine in a browser (IE8) but in the design tab of EW the content is on left of the screen and the header and nav panes are on the right. Is this some bug or am I losing the plot here?
    The web page at www.t-investments.co.uk shows what it should look like. I have put a picture of what it looks like in EW at  www.t-investments.co.uk/pic1.png and the css file is at www.t-investments.co.uk/main.txt

    Any help would be greatly appreciated.

    Incidentally the page doesn't look right in DW CS4 either, The content is some distance vertically down the page but correctly positioned horizontally.

    XP SP3, EW3; IE8

    Many Thanks

    Kev T

All Replies

  • Wednesday, November 04, 2009 2:31 AMKathyW2 Users MedalsUsers MedalsUsers MedalsUsers MedalsUsers Medals
     
    Look at your site in IE7 (or IE7 compatibility mode in IE8).  It looks like your Design View.

    This is a case where SuperPreview can help you see where things are being intepreted differently between the two browsers.  Since I assume you want to support IE7, you'll need to make a change.

    Then, and of secondary importance, Design View isn't any particular browser, and doesn't always match a browser view.  If you think the view is very different from it should display, you can put a bug report in on the Connect site.
  • Wednesday, November 04, 2009 3:29 AMBill Pearson Users MedalsUsers MedalsUsers MedalsUsers MedalsUsers Medals
     
    One thing that would help is if you put everything in an outer wrapper DIV--a DIV that contained/restrained all the other DIVs.

    Right now, your 155px left margin on the page div is referencing the left side of the viewport instead of the div it should be floated next to. If it were working properly (constrained in a wrapper with all the others), that 155px wouldn't be needed; the div would nestle right up next to the left nav, as you want it to.

    Open an EW website template and see how those are laid out, look at the CSS sheet, etc.
  • Wednesday, November 04, 2009 3:48 AMKathyW2 Users MedalsUsers MedalsUsers MedalsUsers MedalsUsers Medals
     
    Adding:

    While I don't think this is the best way to lay out a page, just addressing one issue with the way you've done it and explaining the IE7 view:

    You have #left_nav with position fixed, but no indication of left placement.  IE7 assumes it's to the right of the floated left #page.  Simply adding left:0px will move it over to the correct side.  Ditto for #topcontainer, and it also has no indication of a top setting.  Put both left and top to 0px.
  • Wednesday, November 04, 2009 11:49 PMKevin12853 Users MedalsUsers MedalsUsers MedalsUsers MedalsUsers Medals
     
    Thanks everyone. I think we're sorted now.
    Incidentally I dont get a compatability button with file based web pages, is that correct?
  • Thursday, November 05, 2009 2:21 AMCheryl D WiseMVPUsers MedalsUsers MedalsUsers MedalsUsers MedalsUsers Medals
     

    I get one with local preview but I have EW set to use the preview server for all web pages not just asp.net and php pages. Site > Site Settings > Publishing tab.


    MS MVP Expression Tutorials & Help http://by-expression.com and online instructor led Expression Classes