16 layouts in CS6

after clicking on File -> New, in the new document box, in the layout column, there are only 2 layouts showing, where are the other 14?

You must be using CC which is HTML5 centric.  Many people felt the older starter pages were not up to today's coding standards.  CC offers 2 HTML5 layouts -- 2-col or 3-col.
You can customize the CSS. 
Use Fluid Grid Layouts to create your own responsive layouts for mobile, tablet and desktop. 
Or grab the free Bootstrap extension from DMX Zone.
http://www.dmxzone.com/go/21759/dmxzone-bootstrap
Nancy O.

Similar Messages

  • Dynamic Grid Layout Dreamweaver CS6

    The Dynamic Grid Layout is the main reason for purchase new version of Dreamweaver .
    Dynamic Grid Layout in Dreamweaver CS6 does not work nice, columns are not modify with the mouse, jumps back to the old postition. On You Tube it all looks so very easily, but in practice is all very sloppy about ...
    Ask the forum, Do I have to drag a button to hold...
    If I adjust the width on the left side of the div, I left a red band that set ....
    Where is a make proper manual to find ....

    Thanks for our suggestions, i keep trying, but Easy NO…..
    Geert
    Van: Nancy O. [email protected]
    Verzonden: donderdag 10 mei 2012 17:11
    Aan: Geertskigek
    Onderwerp: Dynamic Grid Layout Dreamweaver CS6
    Re: Dynamic Grid Layout Dreamweaver CS6
    created by Nancy O. <http://forums.adobe.com/people/Nancy+O.>  in Dreamweaver - View the full discussion <http://forums.adobe.com/message/4394107#4394107

  • How to get notified of creation of Alternate Layout on CS6 ?

    Hi,
    I'm working on a plugin for InDesign CS6. I need to get the notification whenever alternate layout is being created on a document.
    Can anyone give any pointers.

    Dear Angnam,
    PLD has no support for SQL. There is no direct field to get the cost. You may need add a UDF to get the value through FMS query.
    Thanks,
    Gordon

  • MultiCamEdit  preview layout in CS6 changes.

    I'd appreciate some help- with this .  First time this has happened.  I'm working on a 3 cam MultiCamEdit.  Been doing this every week for about a year now and all of a sudden, the layout changes.
    Maybe you can suggest a way to reset it back.  I did a "normal" CS6 reset using the  "SHIFT" as I launch.  Didn't help.  Tried to drag and it didn't work.  Maybe I need help with the dragging idea??
    As you can see the two frames over one original gives me a larger "main frame" but the main thing is that the three cams are larger and easier to view.
    Here's the original two frames over one frame.  I like this configuration...........
    Now, all of a sudden today, when I open the MultiCamEdit for this project, I get all three frames on the top row.  Any ideas how I can get back to the two over one configuration?
    I don't like this.

    Thought I'd try again for an answer.  Anyone ?

  • How do I prevent lag with large layouts in CS6?

    I'm having a weird problem. I'm not by any means an InDesign expert, but I know my way around the program pretty well. I would say I'm intermediate? Anyway, I've recently starting doing a lot of creating/editing of large layouts - meaning 100+ page manuals. Sometimes the manuals have images, sometimes they don't, but no matter what, they are unbelievably lag-y. The weird thing is that I will be in a document creating it for the first time and the whole time it will be golden, from creating the first to last pages. I'll even save it at the end and work in it some more and it will be fine. It's only when I open a document that large for the first after that, that it will have problems. For instance, the type tool will take 1 or two minutes to engage and will continue to have problems while I'm working in the document. If I am working in it for 20+ minutes, the problem seems to lessen, BUT as soon as I click out of InDesign (onto a webpage, another document, program, etc) then try to edit the file in InDesign again, the problem is back!
    I'm operating on a Windows 7, running CS6 with everything up-to-date. I don't have much issue with slowness anywhere else. Even when I've been editing a 20+ layer Photoshop file at 600ppi that measured 7x14 feet.
    I will say that the file I'm working on now doesn't have a single image in it, and I know how to reduce image-size to create optimized InDesign documents.
    Is this a preference I have turned on somewhere that I'm missing????

    That doesn't sound like too many styles at all. GREP styles are like live auto-find-and-replace which you will find between drop caps and bullets in your paragraph style definition. They're not the kind of thing you could turn on accidentally.
    It's only when I open a document that large for the first after that, that it will have problems. For instance, the type tool will take 1 or two minutes to engage and will continue to have problems while I'm working in the document. If I am working in it for 20+ minutes, the problem seems to lessen, BUT as soon as I click out of InDesign (onto a webpage, another document, program, etc) then try to edit the file in InDesign again, the problem is back!
    Bob and Peter have given you some splendid advice, but this is just weird. I am running CS4, CS5.5, and now CS6 all day long every day on 4-year-old hardware and don't experience any slowdowns like what you're talking about.  And I just started working on an 80-pager in 16 languages. Sure, I have to wait one or two seconds for the type tool in a long document wit a few cross-references and GREP styles active, but 1-2 seconds is very different from 1-2 minutes.
    You aren't using Span Columns or Split Columns, are you?

  • Background images in fluid grid layouts Dreamweaver CS6

    How can I get a background image png or jpg original size 1040w by 840h to scale down in the tablet and mobile layouts in Dreamweaver CS6 fluid grid layout?

    Adding one of these in your CSS should do the trick...
    background-size:contain;
    or
    background-size:cover;
    Depending on the layout of your background image, one may work better than the other.

  • Creating new website with Fluid Grid Layout in CS6 - CS3 Transitions problem

    I am making my second website with Fluid Grid layout and as with my last one, it seems I can't use CS6 transitions. Each time I go to add a new transition, Dreamweaver stops working and shuts down. Should you be able to use the transitions function with CS6 transitions or not? In the end, what I want to do is create a behaviour where one image is swapped with another with a click (not a rollover as it won't work on mobiles, I believe).
    Thank you

    Add a link to jQuery's Latest Library to your document <head> tags.
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    Add the jQuery function code to <script> tags in your document. I typically put them right above the closing </body> tag.
    <script>
    $(document).ready(function () {
        $("#one").click(function () {
            $("#one-a").toggle('slow');
        $("#two").click(function () {
            $("#two-a").toggle('slow');
        $("#three").click(function () {
            $("#three-a").toggle('slow');
    </script>
    </body>
    As to why DW is closing you down, I don't know.  That's not an expected behavior. 
    Without seeing your code, I'm going to guess that your CSS transition logic is incorrect or you're attempting to add transitions to the FluidGridLayout.css which is never a good idea.  Always use a separate, external style sheet for your manually added content styles.  Changes to either boilerplate.css or the temperamental FluidGridLayout.css files can result in problems.
    Nancy O.

  • Some alternate layout questions CS6

    I have been meaning to ask this as I have an issue coming up again and need to know how to proceed.
    I have a .indd in A4
    I need to do an alternate layout in pixels 600 x 1024
    I was able to create this but the artwork and the text falls outside of the bleed box area. So my question is how can I create an alternative layout from an A4 to a 600 x 1024 pixle portrait and at the same time get the art work to display correctly within the boundries?
    A tutorial available on this?
    Thx
    R

    Click on the page tool then hover over your text box/object center, the following statement will be shown "The object width is locked. Click to change the object width as the page changes width" and a similar statement will display on the object height. Hover on the box/object edge, the following statement will be shown "Space is flexible between object and page edge. Click to pin the object relative to page edge" (those are the 2 options responsible for displaying your objects correctly). Then from the page panel  drop down menu choose create alternate layout and under options choose "Object-based" in the liquid page rule drop down menu. Remember to create the alternate layout after setting your objects for changes to take effect.

  • CSS Transitions Fluid Grid Layout Dreamweaver Cs6 'stops working'

    I am unable to use the CSS Transisions panel at all in Fluid Grids Layout.
    I open the panel but when I select the + to add a transition, the program crashes.
    This is my second website, the same happened when building my first website, but I did without as I could not get a solution (about 18 months ago).
    I need it on this website.
    Some people in Adobe support have my files but can't seem to find a problem. I have Windows 8 on a powerful computer.
    We've tested CSS Transitions on a brand new Fluid Grid Layouts page and it works.
    But never for a page I have content in.
    I began seeking help on this about a month ago and now I'm really being held up.
    I'm disappointed and frustrated that Adobe isn't being more pro-active in finding the solution for their customer.
    I can't email customer service to flag my problem, I am reliant on people who don't get back to me in a timely manner.
    What can I do as this Adobe product has not been working for me and I am relying on it.
    Thank you

    Add a link to jQuery's Latest Library to your document <head> tags.
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    Add the jQuery function code to <script> tags in your document. I typically put them right above the closing </body> tag.
    <script>
    $(document).ready(function () {
        $("#one").click(function () {
            $("#one-a").toggle('slow');
        $("#two").click(function () {
            $("#two-a").toggle('slow');
        $("#three").click(function () {
            $("#three-a").toggle('slow');
    </script>
    </body>
    As to why DW is closing you down, I don't know.  That's not an expected behavior. 
    Without seeing your code, I'm going to guess that your CSS transition logic is incorrect or you're attempting to add transitions to the FluidGridLayout.css which is never a good idea.  Always use a separate, external style sheet for your manually added content styles.  Changes to either boilerplate.css or the temperamental FluidGridLayout.css files can result in problems.
    Nancy O.

  • Problem in desktop layout in "Building fluid grid layouts in Adobe Dreamweaver CS6"

    In this tutorial you taught to design a responsive site ....but the Terrestrial Nursery completed page doesnot work well in Internet Explorer in 14 inches Square Monitor........that you have placed the three columns in the same alignment...but while viewing those three columns comes down one by one..........but works well in wide screen......is there any problem in the size of the monitor..........

    Here is the link to the tutorial......
    http://www.adobe.com/inspire/2012/08/fluid-grid-layouts-dreamweaver-cs6.html
    It doesnot work well in Internet Explorer 8....What to do for the responsive site to work well in all the older versions of IE....

  • HTML/CSS match to InDesign layout

    Hello,
    I have been given the task of taking an InDesign layout from CS6, and building it in HTML/CSS. The challenging part is that it is required to be 1:1 pixel perfect. When I open it in Google Chrome–which is going to be the standard browser it’s opened in–the font raggs differently.
    When I overlay a PNG of the HTML site, and a PNG from the InDesign file it is no where close to pixel-perfect. The text wrapping differently is the main issue at hand. I have tried every CSS hack possible to adjust letter-spacing and word-spacing, I've also explored Google Fonts to attempt to get a better match.
    Does anyone have any experience with a similar ask? In CS6 you can’t specify type pixels, I’m not sure it would matter if you could, because it seems that InDesign is using it’s own conversion for what it considers a pixel.
    Please help!!!

    Agreed, it's way too optimistic. InDesign is a typographic design application, under development since 1999. Already in its very first version, its type engine came "fully grown and armed, with a shout", supporting enough advanced features to squash all but the very stubbornest competition (I'm looking at you, TeX).
    HTML/CSS, on the other hand, has had problems displaying "plain text" since its very beginnings. Only the very latest version of CSS finally addresses some typographic features (probably unnecessary to add, but anyway: with mixed results for different browsers).
    " ..it seems that InDesign is using [its] own conversion for what it considers a pixel", you bet it does. After all, there was a web crowd that outright demanded "pixels" to be a measurement unit in InDesign. Adobe did a have a stab at adding pixels, and if one would ask me, they did it the wrong way. But that's no fault in InDesign. ID has its roots firmly in the "real world", that is, you can design a document with a precision right up to the wavelength of visible light; and ID will happily produce output for it. Your "pixel", on the other -- Darker -- Side, "is" not a real thing. It has no width or height. If you think it does, it goes only for your screen. You may say, "but if necesasry I can hold a magnifier to my screen and count the itty bitty lights!" What if you do so, and discover that your screen does not consist of square pixels, but round ones, or hexagonal, or elongated rectangles? And any measurement would only be value for just your screen. What about mine, your bosses', or your client's?
    Following John's advice, here is a list of features you would need to switch off (as most are enabled by default) before you can even think of mimicking ID's sophisticated text engine in HTML:
    ligatures
    alternate characters
    real small capitals
    tabular or oldstyle figures
    .. wait -- better switch off *all* OTF features
    Paragraph composer. Use the dumb One Line At A Time And We'll See How Far We Get Composer.
    Language based hyphenation.
    Minimum/Optimal/Maximum Word Spacing (CSS must be using this internally, else it could not show justified text; however, I don't think you can set its parameters)
    Letter Spacing and Glyph Scaling (although to be fair, these seem to be already off by default).
    ~16 decimals of precision for every object, line width, text size, spacing, et cetera
    any real-world based measurement unit.
    I probably forgot a few too.
    --- add.
    Advanced character/class kerning
    Optical kerning (not enabled by default)
    -- add2.
    Balance Ragged Lines (off by default; but you can't use it)
    Optical Margin Alignment (as above)
    Align to Baseline grid
    last line indent
    Align to spine
    justify last line (can only be achieved with span/div tricks)
    tabs
    about all internal hyphenation settings (CSS allows 'none', 'manual', and 'auto')
    live text color outline (I may be mistaken, but I bet if it were possible literally everybody would be using it by now -- just like the dreaded "blink" tag did, before it was deemed illegal by federal law)
    skewed text. I know, nobody with a grain of sense uses it in ID.[*] Still, you can't do it in CSS so I'm gonna list it anyway.
    [*] Except myself, by the way. But I don't use it willy-nilly, only after exhausting all the good and the bad options; then yes, I go for the Ugly look.
    Message was edited by: [Jongware]
    Message was edited by: [Jongware]

  • Fluid grid layouts do not work in IE 7/8

    Hello,
    I just created a simple fluid grid layout with Dreamweaver CS6, but there is a problem in Internet Explorer.
    IE 9 shows it right.
    When I start IE 9, I press F12 to get to the developer panel. When I switch to IE 7 / 8, the layout crashes. There are no background colors and text styles anymore.
    Later I will upload some screenshots.
    All other browser work fine.
    Where is the problem here?

    When I resize layout in Firefox, the background colors disappear in mobile portrait, mobile landscape, and tablet portrait.
    Reason:  You added styles to your FluidGrid Desktop  but not  mobile & tablet. 
    In order for FluidGridLayouts to work, you must build your mobile styles first because everything else is based on that.
    I find it's much safer to use a separate style sheet for content.  When you start adding stuff to FluidGridLayout.css, things can get screwed up in a hurry.
    CS6 Fluid Grid Layouts (6 min video)
    http://tv.adobe.com/watch/digital-design-cs6/creating-adaptive-designs-using-fluid-grid-la youts-in-dreamweaver-cs6/
    CS6 Fluid Grid layouts (17 min video)
    http://tv.adobe.com/watch/learn-dreamweaver-cs6/using-fluid-grid-layouts/
    Step-by-Step tutorial -- Building Fluid Grid Layouts in DW CS6
    http://www.adobe.com/inspire/2012/08/fluid-grid-layouts-dreamweaver-cs6.html
    Nancy O.

  • Fluid grid layout problem

    I am trying to create a fluid grid layout.  In fact it is why I purchased Dreamweaver CS6.  Problem is after I create the first div which I named header it works fine.  However, on inserting the next div Dreamweaver inserts the following text in my index.html:
    @charset "utf-8"; /* Simple fluid media Note: Fluid media requires that you remove the media's height and width attributes from the HTML http://www.alistapart.com/articles/fluid-images/ */ img, object, embed, video { max-width: 100%; } /* IE 6 does not support max-width so default to width 100% */ .ie6 img { width:100%; } /* Dreamweaver Fluid Grid Properties ---------------------------------- dw-num-cols-mobile:3; dw-num-cols-tablet 8; dw-num-cols-desktop: 12; dw-gutter-percentage 20; Inspiration from "Responsive Web Design" by Ethan Marcotte http://www.alistapart.com/articles/responsive-web-design and Golden Grid System by Joni Korpi http://goldengridsystem.com/ */ /* Mobile Layout: 480px and below. */ .gridContainer { margin-left: auto; margin-right: auto; width: 85.9444%; padding-left: 2.5277%; padding-right: 2.5277%; } #LayoutDiv1 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #header { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #nav { clear: both; float: left; margin-left: 0; width: 100%; display: block; } /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */ @media only screen and (min-width: 481px) { .gridContainer { width: 91.0625%; padding-left: 0.9687%; padding-right: 0.9687%; } #LayoutDiv1 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #header { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #nav { clear: both; float: left; margin-left: 0; width: 100%; display: block; } } /* Desktop Layout: 769px to a max of 1232px. Inherits styles from: Mobile Layout and Tablet Layout. */ @media only screen and (min-width: 769px) { .gridContainer { width: 88.75%; max-width: 1232px; padding-left: 0.625%; padding-right: 0.625%; margin: auto; } #LayoutDiv1 { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #header { clear: both; float: left; margin-left: 0; width: 100%; display: block; } #nav { clear: both; float: left; margin-left: 0; width: 100%; display: block; } }
    I suspected the respond.min.js file was causing the problem so I downloaded an update but it didn't help.  At this point I am not able to use this feature of Dreamweaver.  Any help will be appreciated.

    Thanks for the help.  I am using version 12.0 build 5861.
    I was trying to follow the example in a book I have called Dreamweaver CS6 – The Missing Manual.  When I got to the section discussing Fluid Grid Layout, I attempted to follow the example step by step.  I was able to insert the first div which I named header.  I looked at my css file and it had placed the #header.
    I knew that I had to remain within the container  div.  I went into the code view and placed the cursor to the right of the header div.  I then clicked the insert Fluid Grid Layout Div Tag button.  That’s when it automatically inserted all of the code I indicated in my post.
    I then started to follow the example in http://www.adobe.com/inspire/2012/08/fluid-grid-layouts-dreamweaver-cs6.html .  I got the same results.
    I’m beginning to wonder if there is an error in the Dreamweaver software itself.
    Any help you can give will be appreciated.
    Sheridan

  • Trouble styling across device views ( Mobile, Tablet, Desktop) in fluid grid layout.

    Hi pros,
    I’m having a problem in Dreamweaver CC laying out and styling my website using the fluid grid layout. For the record, I have not touched the boilerplate.css or JS file and have been using my own.css file to place all my .css in. I’ve managed to get some of the content in little by little but it looks nothing like my mock up. Since I’m new to Dreamweaver and coding in general, I’ve been starting my design in the desktop view. However, when I switch to tablet or mobile view and move something around, it completely moves it when I got back to the desktop view. Also, when I put in on live view or view it in a browser, I get two different looks all together.  I try to make sure that my .css file is selected and under media I tried selecting the predefined media sizes and then under selector, there is usually 3 of each tag (one for each view I’m guessing), I select the tag associated with that view and change the properties from there. That hasn’t worked because when I go to live view or view in the browser, it looks completely off or it will screw with the other views. L
    So here are my specific questions:
    How do I style my elements specifically in each view WITHOUT messing up the desktop, or the other views? Simply clicking on a view using the icons on  the bottom and styling has not worked.
    Why is my live view so different from my browser view? I’m using the presets given in Dreamweaver for the desktop. When I view, say the logo and navigation in live view, everything is aligned but when I switch to my browser (chrome) it’s all crooked.
    Should I be using % throughout all my properties (width, height, margin, padding, positioning)? Currently I have most of my div sized using % but some margins and other properties using px. Will that affect anything?
    Can someone recommend a good tutorial? Everything that I seen either covers the basics that I already know,( adding/moving divs, switch views) but when it comes to the .css styling, they are adding a style sheet from somewhere without showing you how to do it from scratch.
    Should I design the page in a non- fixed layout and then import the .css style sheet from there? If so, how do I do that without messing with the boilerplate.css file.
    I’m taking a course in graphic and web design and we went over this very quickly and was given a lot of the material, however our final project (a full website with 5 pages) must be responsive and built in Dreamweaver. Any advice is greatly appreciated!

    Making an external style sheet.
    Go to File > New > Blank page > CSS. 
    Hit create button.
    Add some style rules to your new style sheet and save it. 
    Link your HTML pages to your new style sheet using the directions below.
    Dreamweaver, Linking HTML to External Style Sheets
    CS6 Fluid Grid layouts (17 min video)
    http://tv.adobe.com/watch/learn-dreamweaver-cs6/using-fluid-grid-layouts/
    Creative Cloud 12.2 Enhancements to Fluid Grid Layouts
    http://blogs.adobe.com/dreamweaver/2013/02/updated-fluid-grids-in-dreamweaver.html
    Step-by-Step tutorial -- Building Fluid Grid Layouts in DW CS6
    http://www.adobe.com/inspire/2012/08/fluid-grid-layouts-dreamweaver-cs6.html
    Nancy O.

  • How to convert live website to fluid grid layout

    I have an existing live website. How do I convert it to a fluid grid layout?

    Who is Peter?
    Responsive Web Design
    http://coding.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/
    Introduction to CSS Media Queries
    http://www.adobe.com/devnet/dreamweaver/articles/introducing-media-queries.html
    CS6 Fluid Grid layouts (17 min video)
    http://tv.adobe.com/watch/learn-dreamweaver-cs6/using-fluid-grid-layouts/
    Creative Cloud 12.2 Enhancements to Fluid Grid Layouts
    http://blogs.adobe.com/dreamweaver/2013/02/updated-fluid-grids-in-dreamweaver.html
    Step-by-Step tutorial -- Building Fluid Grid Layouts in DW CS6
    http://www.adobe.com/inspire/2012/08/fluid-grid-layouts-dreamweaver-cs6.html
    If you want to support multiple languages, you'll need to build a mirror site with translations.
    Nancy O.

Maybe you are looking for