BrowserLab is showing a different layout than my computer

I have Firefox 3.6 on my computer, testing the page in BrowserLab is showing a different layout than it shows on my computer.
I'm wondering now, what is the real look of the web page.
If you send me an email, I will send you a link.

12Jutta34,
BrowserLab produces screenshots based for a resolution of 1024x768.  If your test machine is operating at a different resolution there are likely to be differences.
Another cause may be content that is dynamically manipulated by javascript, plugins, etc.  In these cases, you might try increasing the delay parameter in BrowserLab and see if that helps.
If your problem is not related to these, you can send me the info in an email at [email protected] and I can look into why we aren't producing what you expect.
We appreciate your interest in BrowserLab and value your feedback,
Matt

Similar Messages

  • Address Book contact preview shows a different date than what is input in the birthday field.

    When opening the address book and clicking on an entry, the preview pane at the bottom shows a different date than the date that is entered in the birthday field. It shows the day before the actual date that is entered. See images below:
    Thanks!

    Thunderbird numbering is based on the Extended Support Releases, which are provided every seven "regular" cycles (thus after 7 6-week cycles = every 42 weeks) to minimize fallout from new features hitting the releases to frequently. Initially, those release were issued to organizations only which require some kind of internal review or certification of software prior to deployment.
    Currently we are in the "37.0" cycle and 38 beta 1 has just been released (but doesn't have the fix yet). Meaning, the next release after 31.6.0 won't be 31.7.0 but 38.0 already, followed by 38.1.0 up to 38.6.0, the continuing with 45.0, etc.
    Confusing, yes, but that's what they came up with.

  • Why does eye dropper Lab show a different value than the Lightness channel?

    Can someone help me understand how the L in Lab color in the eye dropper tool maps to the actual Lab Lightness channel?  Both are on a scale of 0-100, but they clearly show different values.  Here's a video that show what I mean (note that if I completely desaturate the color, I get the same results, it isn't a color thing).

    I cannot read much useful in the OP's video, but I think, the OP is not talking about
    HLS- or HSL-Lightness (not available in PS CS6) or HSB-Brightness, but only about
    CIELab Lightness in two different modes:
    Figure 1:
    Figure 2:
    The area was filled with a gray L=50 a=0 b=0.
    In Figure 1 all channels are selected. The values are correct.
    In Figure 2 only the Lightness channel is selected. The value L=54 is wrong.
    What might be the reason?
    Measurements were always taken inside the area. The RGB-values are the same in both modes.
    Please don't verify this by measuring in these Forum-images. These are PNGs in RGB.
    Please verify by repeating the trial.
    Best regards --Gernot Hoffmann

  • HT201401 phone call shows a different person than the number of the contact

    I have never experienced this before and so far as I know, it does not apply to an other contacts but these 2.  Contact X calls me, but the name that appears on the screen is that of contact Y, even though it shows contact X's telephone number.  I looked under each contact and their telephone numbers bear no resemblance to each other.  What can I do to fix this problem?

    Is there a dialtone at the downstairs socket ?, if not (most likely) you would have to order another line, making sure that they understand it's a new second line, when it's up and running, you cease the upstairs line, and get the downstairs line renumbered from whatever number they allocted to the number that was ceased upstairs, keep in mind you would need to get broadband on the new line before ceasing the existing line,so a new broadband account, plenty of opportunity for this to go wrong of course, if there is a dialtone (stopped line) , similar , get the stopped line started then cease and renumber etc.
    Personally I think I would just run a good quality extension cable from the upstairs to downstairs, do a speed test and if it hasn't affected the speed much, go with that,
    There are products available , based on time related charges, but it can be expensive, more than the provision of a new line and a renumber, it's along the lines of £x for the first half hour, then £x for each subsequent half hour or part half hour, then the guy (or girl) who turns up would probably just rearrange the lines outside at the pole, but getting the service provider to order this may be difficult

  • "Show List of values"  showing different values than "Preview List of values for the same dimension Object

    Hi All, 
    I have a dimension object in Business Layer which is showing a different values than the original database values. When I right click on the object and select "Show List of Values its showing values which are not related to the original values in the database but if I right click on the same object and select "Preview List of Values" it shows the right values present in the database. Any suggestions on how to rectify. It was working good and many reports have been built using that particular dimension.
    Is there any way to fix the problem without the deleting the object or recreating another similar object as the object has been used in several reports, so by deleting or recreating the object may break the reports.
    Please help!

    Hi
    A  list of values is a list that contains the data values associated with an object, Lists of values inserted in the data foundation are inherited by any business layer based on the data foundation.
    Right click on the object and select  “Show Values”… Display all the DB values including null
    Preview List of Values – also display same values...getting differnece meens...Check weather using any Static List of Values.
    If you uncheck the Associated list of values check box "Preview List of Values" options is disabled.
    For best practice …LOV is disabled for un-necessary dimension objects
    Also If you have Db access check the correct data by
    SELECT
    Distinct Schema name. Table/View name. Object name
    FROM
    Schema.name. Table/View name

  • Network prefs shows a different IP address...

    I'm trying to reset my IP address... and I thought I did, but now Network prefs is showing a different IP than shows up online. Somehow my IP is being blocked on a site that I need for school. Can someone help me figure out how to change it?

    How are you connecting to the Internet?
    Most of us who connect via a router (rather than dialup) will have two IP addresses: internal and external. The internal depends on the router itself and may have a number in the series 10.0.x.x or 192.xx.xx.x depending on the installation. If your network prefs is showing a 169.x.x.x number then that is self-assigned.
    The external IP depends on your service provider.
    If you are connecting to a router using DHCP, you may want to switch to manual, press Apply, then switch back and press Apply again.
    If the problem is concerning your router and its external links (and IP address) some more information would be useful.

  • Hi - for any photo, info in mountain lion shows a different file size than Photoshop does. I've tested with CS3 and CS6 and get the same problem. Doesn't happen with CS3 and OSX10.4 or any previous versions of Photoshop and OSX. Anyone know why?

    Hi - for any photo, info in mountain lion shows a different file size than Photoshop does. I've tested with both CS3 and CS6 on 10.8.2 and get the same problem. This doesn't happen with CS3 and OSX10.4 or any previous versions of Photoshop and OSX. Anyone know why?

    this one is actually a really rare symptom of a flaky connection to the ipod on a Windows PC. there's more going on in terms of hardware on nanos and 5th gens than in the earlier models ... so if the connection is flaky to precisely the right/wrong degree, itunes will see the ipod, but misidentify it as an earlier version of ipod.
    tracking down the cause of the flakiness can be tricky ... as you already know ...
    just checking. have you tried connecting with a different (known-good) USB cable? does that seem to have any impact on the rate of occurence of the problem?

  • Customer balance display shows different balance than Profit center balance

    Dear All
    Customer balance display shows different balance than
    Customer balance with profit center.
    Adivse us for the same.
    Viral

    Hi
    Please run 1KEK and then check the balances.
    payables and receivables cannot be transferred to Profit Center Accounting online. You must always transfer them periodically.
    The purpose of this activity(1KEK) is to:
    1. create the opening balances for payables and receivables
    2. transfer the balance changes for payables and receivables periodically
    Thanks
    Prasad

  • TS4006 Why is the Find my Phone app showing my iPhone to be in a different location than where it is?

    I have my son's iPhone registered on my Find my Phone app. but it's showing his
    phone to be in a different location than it is - I know as I've just called him at his friends
    house on the landline but its showing him to be about 1/4 of a mile away from where he
    is, does anyone know that would be please (he had his iPhone on him)? Thanks

    I frequently find the pin to be a little off.  For example, a device in the east end of my house may be located at the west end.

  • Safari shows colors different than other browsers and GoLive

    Does anyone know why Safari shows colors differently than Firefox, Explorer and Opera, Mozilla and Golive?
    For example if I use "websafe" colors in photoshop with 2.2 gamma and sRGBie...2.1 and save, then import into Go Live with the working space the same, North America Web/ Internet, the colors are typically darker, although occasionally they are the same.
    I have tried embedded profiles and non embeded.
    The difference only happens when I view the page in Safari. By the way I use a mac, GoLive CS2
    This is a constant frustration. I have created several tests but have found no satisfactory results. I am in the process of creating a website for teachers who use powerbooks and safari. And this color change really restricts creative possibilities. If the same page is viewed in Firefox it looks like it does in GoLive.
    Thanks for any help,
    Kevin

    >> When no profile is in use.. Safari will assume sRGB becaus this is the web standart profile...
    True on Windows Safari and other Windows browsers.
    Safari on Mac and other Mac browsers 'assumes, assigns, applies' the Mac's default monitor profile to untagged color.
    This is easy to proof here in the sRGB rollover:
    http://www.gballard.net/psd/go_live_page_profile/embeddedJPEGprofiles.html
    If Mac Safari 'assumed' sRGB on untagged files, then the sRGB rollover will have zero change.
    +++++
    >> converting to sRGB before saving for the web ensure god color in all browseres, and JPG and PNG can be savde with color profile
    Except in Mac browsers that have 1.8 monitor gamma profiled.
    The Mac-specific problem with trying to match tagged graphics on matched-color background in Safari is:
    1) The color background is untagged and will Assume default Monior RGB.
    2) The tagged graphic will be Converted to Monitor RGB.
    In other words, if you fill a page with 4bb93c and place a tagged sRGB image, filled with 4bb93c, the two colors won't match up in color-managed Mac web browsers like Mac Safari...however, if you untag the sRGB file, it will disappear on the page, but it will be off color depending how close Monitor RGB is to sRGB profile in Mac browsers.
    Windows, on the other hand is a different beast, it Assigns sRGB to untagged color, so tagged/untagged sRGB will be good in all Windows browsers.
    At least that is what I have seen here on my Windows Vista Business box.

  • After updating my 5s it will not longer logon to free wifi at our local YMCA. It worked perfectly before and works at all other free wifi's. My wifes 5s works perfectly at the same Y but it shows a different IP address for their wifi than mine.

    After updating my iphone 5s to ios8 it will no longer log onto the free wifi at my local YMCA. It works prefectly everywhere else. My wife's 5s works perfectly there but shows a different IP address for their router. Mine worked prefectly there before. What can be done?

    After updating my iphone 5s to ios8 it will no longer log onto the free wifi at my local YMCA. It works prefectly everywhere else. My wife's 5s works perfectly there but shows a different IP address for their router. Mine worked prefectly there before. What can be done?

  • How do I use different Layouts?

    I am trying to make a program that runs in a window like this:
    http://www.exyt-web.com/Window.gif
    The problem I'm having is with the layout.
    How do I have more than one layout ?
    For example - as you can see in the image (hyperlink above) I wish to have a border layout with a JFrame at the North position and then in the South position I want to have buttons laid out in a FlowLayout.
    Also with my radio buttons I want these in a GridLayout(3, 0) layout.
    I made up some example code to test using different layouts - but it seems one layout always overrides the other...
    import java.awt.*;
    import javax.swing.JFrame;
    import javax.swing.JLabel;
    public class LayoutTest extends JFrame
        public LayoutTest()
            setTitle("Hello World");
            Container contents = getContentPane();
            Container contents2 = getContentPane();
            contents.setLayout(new FlowLayout());
            contents.add(new JLabel("<FILTER [Type a th|    ]>"));
            contents.add(contents2);
            contents.add(new JLabel("< Filter Button >"));
            contents.add(new JLabel("<  Add Button   >"));
            contents2.setLayout(new GridLayout());
            contents2.add(new JLabel("< Button 1 >"));
            contents2.add(new JLabel("< Button 2 >"));
            contents2.add(new JLabel("< Button 3 >"));
            contents2.add(new JLabel("< Button 4 >"));
            setDefaultCloseOperation(EXIT_ON_CLOSE);
            pack();
        } // HelloWorld
        public static void main(String [] args)
            LayoutTest theLayoutTest = new LayoutTest();
            theLayoutTest.show();
        } // main
    } // class HelloWorldI know this obviously doesn't work but I hoped it would show what I was trying to do.
    I also tried creating a new 'contents2' and then adding it into 'contents'
    e.g. contents.add(contents2); My current code for the window I'm trying to create so far is:
    import java.awt.*;
    import javax.swing.*;
    public class Menus extends JFrame
        public static void Menus()
            // Creates a new JFrame, with the title specified in quotation marks.
            JFrame frame = new JFrame("Film Database");
            // Sets the default close operation of the frame.
            frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
            // Creates a new menu bar for the frame.
            JMenuBar menuBar = new JMenuBar();
            // Creates a new menu for the menu bar.
            JMenu menu = new JMenu("File");
            addFrameContents(frame, menuBar, menu);
            // Sets the new menu bar on the frame
            frame.setJMenuBar(menuBar);
            frame.pack();
            frame.setVisible(true);
        } // HelloWorld
        public static void addFrameContents(JFrame frame, JMenuBar menuBar, JMenu menu)
            // Adds the menu to the menu bar.
            menuBar.add(menu);
            // Creates a new item for the menu with a small icon.
            JMenuItem menuLoad = new JMenuItem("Load", new ImageIcon("C:/load.gif"));
            // Adds the new item to the menu.
            menu.add(menuLoad);
            JMenuItem menuSave = new JMenuItem("Save", new ImageIcon("C:/save.gif"));
            menu.add(menuSave);
            JMenuItem menuQuit = new JMenuItem("Quit", new ImageIcon("C:/quit.gif"));
            menu.add(menuQuit);
            // Creates a new container.
            Container contents = frame.getContentPane();
            // Sets a new layout for contents, in this case FlowLayout.
            contents.setLayout(new GridLayout(2, 0));
            // Adds new JLabels to the container.
            contents.add(new JLabel("< JLabel 1 >"));
            contents.add(new JLabel("< JLabel 2 >"));
            contents.add(new JLabel("< JLabel 3 >"));
            contents.add(new JLabel("< JLabel 4 >"));
            JLabel thisLabel = new JLabel("Hello");
            thisLabel.setLayout(new FlowLayout());
            JLabel thisLabel2 = new JLabel("Hello2");
            thisLabel2.setLayout(new FlowLayout());
            contents.add(thisLabel);
            contents.add(thisLabel2);
        public static void main(String [] args)
            Menus();
        } // main
    } // class HelloWorldAny help on how I can use two separate layouts in the same frame would be great!
    Regards,
    Tom

    doing this:
    Container contents = getContentPane();
    Container contents2 = getContentPane();
    does not create 2 different containers. It's just creating 2 variables that refer to the same container. There is only 1 content pane in a window/frame. A container can only have 1 layout.
    If you want to have 2 layouts, you create 2 panels with separate layouts and put what you want in each panel, and put both panels in the content page.

  • Preview in Browser and Adobe Browser Lab show website differently? Please help

    Hi...working on my first website and I have a question about the differences in viewing the site through
    choosing file...preview in browser....
    from within Dreamweaver, and using the Adobe Browser Lab to view the website.
    There seems to be a very significant difference between the two. When I preview firefox from within dreamweaver, my site is just how I want it.
    When I go to browser lab, it is...well... a disaster.
    I'm attaching screenshots of the two as well as my code, so it can show how different they are. Here is a screenshot of the website as it looks when I use the preview in browser function from within dreamweaver to view it in firefox. This is how I'd like it to look.
    And here is a screenshot of what it looks like when I preview it in Adobe Browser Lab in Firefox.
    The quote is underneath the logo, the left div text is flowing over the center div, the nav bar graphics are too narrow, the photo is hanging outside the div it should be contained in. Not what I want.
    Does anyone have any insight into how I would fix this or which version is correct?
    I'm stumped. This is my first website: shouldn't these two things be similar? And which one is correct?
    and here is my code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Your Career Direction Career and College Counseling</title>
    <style type="text/css">
    <!--
    @font-face {
        font-family: 'museo_sans_500regular';
        src: url('museosans-500-webfont.eot');
        src: url('museosans-500-webfont.eot?#iefix') format('embedded-opentype'),
             url('museosans-500-webfont.woff') format('woff'),
             url('museosans-500-webfont.ttf') format('truetype'),
             url('museosans-500-webfont.svg#museo_sans_500regular') format('svg');
        font-weight: normal;
        font-style: normal;
    @font-face {
        font-family: 'museo_sans_500italic';
        src: url('museosans-500italic-webfont.eot');
        src: url('museosans-500italic-webfont.eot?#iefix') format('embedded-opentype'),
             url('museosans-500italic-webfont.woff') format('woff'),
             url('museosans-500italic-webfont.ttf') format('truetype'),
             url('museosans-500italic-webfont.svg#museo_sans_500italic') format('svg');
        font-weight: normal;
        font-style: normal;
    @font-face {
        font-family: 'binary_itcregular';
        src: url('binaritcbol-webfont.eot');
        src: url('binaritcbol-webfont.eot?#iefix') format('embedded-opentype'),
             url('binaritcbol-webfont.woff') format('woff'),
             url('binaritcbol-webfont.ttf') format('truetype'),
             url('binaritcbol-webfont.svg#binary_itcregular') format('svg');
        font-weight: normal;
        font-style: normal;
    }body {
        margin: 0;
        padding: 0;
        color: #000;
        font-size: 100%;
        line-height: 1.4;
        background-image: url(images/background.gif);
        background-repeat: repeat;
    /* ~~ Element/tag selectors ~~ */
    ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
        padding: 0;
        margin: 0;
    h1, h2, h3, h4, h5, h6, p {
        margin-top: 0;     /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
        padding-right: 15px;
        padding-left: 15px;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    h1 strong {
        color: #C60651;
        font-size: 90%;
        font-family: "Binary ITC Bold";
    h1 strong em {
    a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
        border: none;
    /* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
    a:link {
        color:#414958;
        text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
    a:visited {
        color: #4E5869;
        text-decoration: underline;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
        text-decoration: none;
    /* ~~ this container surrounds all other divs giving them their percentage-based width ~~ */
    .container {
        width: 80%;
        max-width: 1260px;/* a max-width may be desirable to keep this layout from getting too wide on a large monitor. This keeps line length more readable. IE6 does not respect this declaration. */
        min-width: 780px;/* a min-width may be desirable to keep this layout from getting too narrow. This keeps line length more readable in the side columns. IE6 does not respect this declaration. */
        background: #FFF; /* the auto value on the sides, coupled with the width, centers the layout. It is not needed if you set the .container's width to 100%. */
        margin-top: 0;
        margin-bottom: 0;
        margin-right: auto;
        margin-left: auto;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300";
        border-right-width: thick;
        border-left-width: thick;
        border-right-style: solid;
        border-left-style: solid;
        border-right-color: #C60651;
        border-left-color: #C60651;
    /* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */
    .header {
        padding-top: 40px;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    #Quote {
        float: right;
        clear: left;
        margin-right: 50px;
    /* ~~ These are the columns for the layout. ~~
    1) Padding is only placed on the top and/or bottom of the divs. The elements within these divs have padding on their sides. This saves you from any "box model math". Keep in mind, if you add any side padding or border to the div itself, it will be added to the width you define to create the *total* width. You may also choose to remove the padding on the element in the div and place a second div within it with no width and the padding necessary for your design.
    2) No margin has been given to the columns since they are all floated. If you must add margin, avoid placing it on the side you're floating toward (for example: a right margin on a div set to float right). Many times, padding can be used instead. For divs where this rule must be broken, you should add a "display:inline" declaration to the div's rule to tame a bug where some versions of Internet Explorer double the margin.
    3) Since classes can be used multiple times in a document (and an element can also have multiple classes applied), the columns have been assigned class names instead of IDs. For example, two sidebar divs could be stacked if necessary. These can very easily be changed to IDs if that's your preference, as long as you'll only be using them once per document.
    4) If you prefer your nav on the right instead of the left, simply float these columns the opposite direction (all right instead of all left) and they'll render in reverse order. There's no need to move the divs around in the HTML source.
    .sidebar1 {
        float: left;
        width: 15%;
        padding-bottom: 10px;
        margin-top: 40px;
        border-top-color: #FFF;
        border-left: #FFF;
        margin-left: 25px;
        background-color: #FFF;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    .content {
        width: 60%;
        float: left;
        margin-top: 40px;
        padding-top: 10px;
        padding-right: 10px;
        padding-bottom: 10px;
        padding-left: 0;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    .sidebar2 {
        float: left;
        width: 30%;
        background-color: #D3CCB2;
        margin-top: 40px;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-left: 0;
        border-top-color: #FFF;
        border-right-color: #FFF;
        border-bottom-color: #FFF;
        border-left-color: #FFF;
        border-right-width: 5px;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    /* ~~ This grouped selector gives the lists in the .content area space ~~ */
    .content ul, .content ol {
        padding-top: 0;
        padding-right: 25px;
        padding-bottom: 15px;
        padding-left: 60px;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300";
        font-size: 100%;
        color: #666;
    #Quote {
        float: right;
        clear: both;
    /* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
    ul.nav {
        list-style: none; /* this creates the space between the navigation on the content below */
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
        line-height: 250%;
    .nav {
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    ul.nav li {
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
        padding: 5px 5px 5px 15px;
        display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
        text-decoration: none;
        color: #333333;
        background-color: #FFF;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
        color: #C60651;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
        background-color: #FFF;
        background-image: url(images/navbar2.gif);
    /* ~~The footer ~~ */
    .footer {
        padding: 10px 0;
        position: relative;/* this gives IE6 hasLayout to properly clear */
        clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
    /* ~~miscellaneous float/clear classes~~ */
    .fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
        float: right;
        margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
        float: left;
        margin-right: 8px;
    .clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
        clear:both;
        height:0;
        font-size: 1px;
        line-height: 0px;
    .container .content {
        width: 50%;
        font-size: large;
    #footer {    width: 100%;
        background-color: #FFF;
    .container .sidebar2 h4 img {
        padding-left: 20px;
        padding-top: 0px;
    .sidebar2 p img {
        border: medium solid #C60651;
    #Insert_logo2 {
        border-top-width: 4px;
        border-right-width: 4px;
        border-bottom-width: 4px;
        border-left-width: 4px;
        border-top-color: #fff;
        border-right-color: #fff;
        border-bottom-color: #fff;
        border-left-color: #fff;
    .container .content p .content strong {
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    .container .content .content {
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    .container .content ul li strong {
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
        font-size: 95%;
        line-height: 150%;
        list-style-type: disc;
    test {
        font-family: "Binary ITC Bold";
    .container .sidebar2 p img {
        margin-right: auto;
        margin-left: auto;
        border-top-width: medium;
        border-right-width: medium;
        border-bottom-width: medium;
        border-left-width: medium;
        border-top-color: #C60651;
        border-right-color: #C60651;
        border-bottom-color: #C60651;
        border-left-color: #C60651;
    li strong {
        line-height: 130%;
        list-style-type: circle;
        color: #978980;
    .container .content ul {
    .container .sidebar1 .nav {
        margin-top: 10px;
        margin-bottom: 10px;
    .nav li a {
        background-image: url(images/navbar2.gif);
        background-repeat: no-repeat;
        background-position: right center;
        left: auto;
        right: auto;
        clip: rect(auto,auto,auto,auto);
    .container .sidebar1 h6 {
        padding: 0px;
        color: #000000;
    #footer h3 strong {
        font-size: 60%;
        color: #978980;
    .container .content p {
        padding-left: 5%;
        padding-right: 5%;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    .container .sidebar2 p {
        padding-right: 8%;
        padding-left: 8%;
        padding-top: 5px;
    #Insert_logo2 #Insert_logo2 {
        padding-left: 15px;
    .container .content ul {
        color: #C60651;
    h6 {
        color: #000;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    .sidebar1 h8 strong {
        font-size: 80%;
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300";
    .container .sidebar1 h7 {
        font-size: 40%;
        color: #978980;
    .h7 {
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
        font-size: 15%;
    .container .sidebar1 h8 {
        font-family: "Museo Sans 500", "Museo Sans 500 Italic", "Museo 700", "Museo 500", "Museo 300", Arial;
    -->
    </style><!--[if lte IE 7]>
    <style>
    .content { margin-right: -1px; } /* this 1px negative margin can be placed on any of the columns in this layout with the same corrective effect. */
    ul.nav a { zoom: 1; }  /* the zoom property gives IE the hasLayout trigger it needs to correct extra whiltespace between the links */
    </style>
    <![endif]--></head>
    <body>
    <div class="container">
      <div class="header"><!-- end .header -->
        <p class="clearfloat"><a href="#" id="Insert_logo2"><img src="images/YCD-logo-tag-RGB-web-SM.gif" alt="Insert Logo Here" name="Insert_logo" width="638" height="110" id="Insert_logo2" style="background: #FFF
        ; display:block;" /></a></p>
        <div id="Quote"><img src="images/quote.gif" alt="Choose a job you love" width="355" height="81"></div>
        <p class="clearfloat"> </p>
      </div>
      <div class="sidebar1">
        <ul class="nav">
          <li><a href="#">Home</a></li>
          <li><a href="#">Students</a></li>
          <li><a href="#">Parents/Educators</a></li>
          <li><a href="#">Professionals</a></li>
          <li><a href="#">Bio/Contact</a></li>
          <li><a href="#">Q &amp; A Blog</a></li>
          <li><a href="#">Testimonials</a></li>
        </ul>
        <p> </p>
        <p> </p>
        <p> </p>
        <h8><strong>Your Career Direction</strong><br></h8>
        <h6>96 Harvard Avenue<br>
        Maplewood NJ 07040<br>
        [email protected]<br>
        (973) 996-0207</h6>
        <h7>© Your Career Direction, LLC, 2012<br>
      </h7>
        <p> </p>
      </div>
      <div class="content">
        <h1><strong><img src="images/Whether-you-are.gif" width="266" height="48" alt="Whether you are"></strong></h1>
        <ul>
          <li><strong>Considering your college choices &amp; career options</strong></li>
          <li><strong>Preparing for the world of work after college</strong></li>
          <li><strong>Seeking a new position to further your career</strong></li>
          <li><strong>In-transition and considering new opportunities</strong></li>
          <li><strong>Seeking to make a significant and meaningful career</strong> <strong>change</strong></li>
        </ul>
        <p> </p>
        <h1><img src="images/One-thing-is-for-sure.gif" width="310" height="38" alt="One thing is for sure"></h1>
        <p>We all need to direct our own careers, our own lives!</p>
    <p>Given today's competitive job market, global economy, and changed corporate culture, we can no longer depend upon others to ensure our professional futures. Choosing or changing your career direction requires self-reflection, career education and an action plan. </p>
    <p> Building a successful and rewarding career requires linking your interests, education and skills, with trending industries, job opportunities and your experience.  It takes making smart decisions about your college major, vocational training and continuing education options. With motivation, persistence and top notch job search skills, you can succeed in finding a path to building a career that is right for you.</p>
    <p>At Your Career Direction, we are your advocate. We listen, assess, strategize, inspire, counsel, and network on your behalf. With a personalized, holistic approach, we'll work with you to help you create an action plan; a path designed to get you to where you want to go. </p>
    <p> </p> 
    <!-- end .content --></div>
      <div class="sidebar2">
        <p><img src="images/Counselingastudent.gif" width="321" height="256" alt="Lisa Mark counseling a student"></p>
        <p>By combining an understanding of your interests and current skills with what&rsquo;s happening in today's marketplace we&rsquo;re able to partner with you to develop new career ideas, target companies, and generate job and internship opportunities. We provide step by step assistance to ensure success in your written communications, presentation skills, job search, interviews and life choices.</p>
    <p>At Your Career Direction, YOUR career is our passion. Our mission is to educate and counsel you to choose your own path in life and become what you want to be. </p>
    <p> </p>
    <p> </p>
      <!-- end .sidebar2 --></div>
      <div class="footer">
        <div id="footer">
          <h3 align="center"> </h3>
        </div>
        <p> </p>
      <!-- end .footer --></div>
    <!-- end .container --></div>
    </body>
    </html>
    Thanks for your help.

    You are using % widths for your layout which means it will look different depending of the size of each users monitor. Although this is probably the better way to go these days, it is not one size fits all and will work more effectively if you include min and max widths, and also media queries that change your layout depending on the monitor size. This is more advanced coding and will take time if you want to do that. Alternatively, you could design using pixel widths and have it look consistent across all desktop browsers and throw a few media queries in for the mobile side.
    Responsive Web Design
    http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/#more-7 5660
    More on Media Queries
    http://mobile.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mo bile-version-of-your-website/

  • How can I create multiple pages, with different layouts to the others, in DW fluid grid layouts?

    Hi everyone,  : )
    I am creating a website using FGL in DW CS6, v12.0 build 5808.  I do not have Creative Cloud (do you have to pay to use this service?).
    I have created one layout for my home page.
    I would like to create several more pages, but I want them to use different layouts (as well as different content).
    I tried to do something similar before using 'save as' (this was with a non-FGL), but whenever I changed the original page that I had 'save as'd' from, the layout in all the other pages would change too!
    I found a possibility from someone else online suggesting using a template, but have not tried it yet: http://www.linkedin.com/groups/Adding-second-fluid-page-in-119937.S.192422240
    I'm a bit scared of breaking everything, as I am new to web design and have had to restart the whole process a few times due to messing up the fluid.css etc and other issues, so I am taking baby steps.
    Happy to try whatever's suggested and, while I wait for (I hope) your responses, I think I will try the template thing, but from the reply the person who asked the question gave, it sounds like his subsequent pages changed too, as I mentioned above?  *scared*  ; )
    If anyone can help me with this query I would be very grateful.  Thank you!  : )

    Thanks David.
    I tried using different IDs for the other pages, but eventually one of the divs seems to 'break' - it overlaps other divs, or cannot be moved or resized (you can select the outline and it goes blue, but no 'move up a row' or down a row or 'lock to grid' etc icons appear and it can't be drag-re-sized), plus the green overlay disappears (just from that div.  I'm aware of how to turn visual aids on and off), so it seems broken.  This often seems to happen if you rename a div once it's been created; it does not rename in the layout.css on the right side panel (CSS Styles) in DW and the 'broken' behaviour above is exhibited.  Do you know anything about this?  Is this the 'edit this doc at your peril' stuff that most tutorials seem to mention?  Am I doing something wrong?
    I also tried making an FGL and saving out the original boilerplate.css, layout.css and respond.js.  Then created multiple new FGLs and each time it created new versions of layout.css (called 'untitled-1', 2 etc.).  Once I had created all the FGLs, I deleted all the new boilerplates and untitled.css files.  Then restored the original ones and changed the link at the top of each page's html to refer to the same filename (the original layout.css), rather than untitled.css.  I thought this might work and it seemed to for a while, but then as I had to add new div names for the sections on each page, it eventually broke (as above).
    Anyway, I think you have a good point about different layouts and it occurred to me also while I was exploring and waiting for replies here.  I think I will make one layout for all pages and go with that.  I have a couple of questions about that though:
    1. I think the max number of divs I want for one of the pages is 10, but some pages need less divs.  If I only fill e.g. 8 divs on one page, will the other ones be sat there empty?  I think they will actually...I guess I'm asking because I have not tried it yet (will do after this) and it takes so long to do this trial and error.
    2. If the amount of content in each div is different, e.g.  let's say Page 1 has 6 lines of content in div1, but page 2 may have an unlimited amount of content (I will want to add to it in the future).  Will this result in the div on page 1 being a huge block of empty space after its 6 lines?
    Thanks so much for your help!

  • How do I create a automatic second page with different layout settings?

    Hi there,
    I want to create a business letter template with a different second page. I already managed to create a different layout on page nr two, but
    whenever I write a letter with this template and I reach the end of page one, pages creates a thrid page in between my page nr one and nr two with a mixture of the layout of template page nr two and the footer of page nr one.
    I want pages to take my template page nr two (with different header and footer) as second page instead of creating one itself.
    If I don't need a second page - because my letter is to short - I should not have to delete a second page. It simply should not be there...
    Thanks for Help!
    G4's and 12" PB   Mac OS X (10.4.6)  

    Hello Stefan,
    you achieve this with a little trick. Create your letter and set the layout for the first and the second page by inserting a placeholder text. This placeholder text should fill the first page and the top of the second page, so both pages are build in one section. When the entire letter is layouted well, select the placeholder text and than save the letter as a template.
    Now every time you open this template, you only have to insert the main text (replace the placeholder text with real content), and the second page disappears until the main text overflows the borders of the first page. Than you will get the second page again with the layout you have created for it.
    I hope this will work for you like it works fine for me.

Maybe you are looking for