Fluid design grid how

I'm curious as to how I would go all this in dreamweaver with a fluid design grid.

PPS FartAround.jpg

I can split the background with a gradient easily enough, but what I do for the 'main' green dark. Dreamweaver, tells me that I can not put a div in a div after the .clearfix container. Sorry if it's simple, I'm certainly not a professional Web Designer / coder. Come play with something.

What version of DW have you?

I do not recommend using fluid grid (Legacy) layouts.  They were OK, when they came out in 2012, but Adobe has renounced them.  Inheritance is code talk because they won't be around much longer.

Bootstrap is more robust.  You can nest a div inside the DIV tags, no problem.

body - background 2-tone

bottom of container - Green

the inner tank - white background.

Nancy O.

Tags: Dreamweaver

Similar Questions

  • Fluid put grid in connection to what style sheet

    I'm brand new to the fluid design grid Layouts and websiite then please explain your answers carefully. One of our members told me that there should be at least 3 stylesheets using fluid grid Layouts. The first two are automatically created by Adobe CS6 and advice is do not delete them. My question below is about the stylesheet wide third, custom, I created.

    • Fluid.CSS = layout
    • boilerplate. CSS browser reset =
    • your_custom. CSS = site wide styles

    The question is: how to index.html and other pages follow the styles created in the custom site wide stylesheet? I created a 3rd, large custom site style sheet and although I've linked index.html to this style sheet, is to ignore the Styles that I created in the custom css file.

    I found what I was doing wrong. I changed the font and size of police as the smart phone of the style sheet section. I didn't know that I also have to change it in the desktop section and a tablet. I feel like a jerk, but at least I figured it.

    Thank you very much Ben! I don't know that I have additional questions that I move along.

  • Impossible to fluid design option

    I don't see the option to choose the fluid design when I try to create a new Web site. I use Muse CC 2015 on an imac. attached photo shows options when starting new site:

    Screen Shot 2016-05-15 at 2.20.46 PM.png

    You must update to Muse CC 2015.1.

  • In an attempt to sign and date a w-9, I get the following message.  "This form is editable in Adobe Acrobat DC.  Please use Adobe life cycle Designer. "How can I get this document dated and signed without having to buy the life cycle Designer?

    Please provide ideas to the next question. In an attempt to sign and date a w-9, I get the following message.  "This form is editable in Adobe Acrobat DC.  Please use Adobe life cycle Designer. "How can I get this document dated and signed without having to buy the life cycle Designer?

    Thank you

    Rick

    Assuming that you are dealing with a PDF file provided by the IRS, you will not be able to e-sign. but you can fill the fields using Adobe Reader or Acrobat. The version of form W-9 that I have does not include a date field, but you can use the feedback tool add text to add a date. You can also digitally sign or use the annotation of pencil tool to draw a signature.

  • What deleted version fluid layouts grid?

    I want to know which version of Dreamweaver updates removed fluid layout grid.

    I looked around the Adobe site, but what they will tell you what's new, not much on what has been removed.

    Grid layouts fluid have not yet been removed in the latest version of DW.

  • I want to change the color of the grid, how to change?

    I want to change the color of the grid, how to change?

    HI -.

    Sorry to disappoint you, but the color of the grid of reflow is not configurable by the user.

    VIC

  • T-Shirt Designing (1): how to make wider white box (using the model of t-shirt)?

    CS6 using

    T-Shirt Designing (1): how to make the white box more wide inside the shirt (using the model of t-shirt)?

    Well, I learned that I can go to file > new from the template > blank template > T-shirt to start to create a design for my t-shirt.

    It shows a small picture of the t-shirt with a rectangle in the middle that also represents the large rectangle (where I create my design).

    Question, am I suppose to create the right design in the large rectangle?

    2nd... I figured out how to adjust the length and width of the largest rectangle (through the corners, then clicking on it to open the section length/width at the top of the screen). However, when I adjust the height and width, is not the same for the rectangle inside the shirt.

    What I'm trying to do, is ensure that my design takes more than forward of the sweater by expanding the width.

    How to make the small rectangle in the large t-shirt too?

    Hello

    The small rectangle in the t-shirt line drawing is a guide. So, what you need to do is unlock guides, remove the small rectangle and create a new.

    (1) go to the view > Guides > release Guides. You will now be able to edit the guides, which are light blue in my document.

    (2) just so that you know what I'm talking specifically, open the Layers panel and place you on the Guides layer. Click the arrow next to reveal the guides within the layer. I locked all the other layers in the document to make it easy for me.

    (3) select the small rectangle, and delete.

    (4) use the Rectangle tool to draw a new in size.

    5) option click on the new rectangle to open a launcher. Select make Guides.

    You now have a guide again, larger rectangle! Let me know if you have any other questions.

  • How to replace the gutter while using fluid layouts grid?

    Hello

    My problem occurs when I try to take two of my divs in the checkerboard to fluid and make them so that they are all built-in. I removed the left margin of the div on the right side and makes the two divs side by side in the designer view. However when I take a glance on the site in IE or Chrome a gap remains between the div where the gutter is to.

    I don't know exactly what we call this technique, but I'm trying to get the look that it is beveled and it separates the columns. problem w divs.png Two areas of the circles are where I want the divs to be routed via line side by side with the other. It is supposed to look like this.

    correct.png

    As I mentioned above, I use the grid to fluid. I don't know there must be a way to move the div is above. However, I believe that the problem may have to do with the "locked" for Gates div. I tried to remove the left margin which had some divs, this seems to solve the problem in DW, but isn't actually once I have test.

    I'm fairly new to DW but I was able to pull this off so far and this is the only problem that keeps me from this site to complete.

    Another idea I had was to just wrap the 3 layers of content I want to be together and put them in a div that surrounds all 3 and set the background image of the main div to this image. However, the problem with this is that as scales the image down the page is cut and then before you know I do not have the look I want. If there is a way to make the background image to maintain its width and the scale of the page, I think this might be an easier solution.

    If anyone has any ideas on how to fix it please let me know.

    Thanks in advance

    Hello again,

    So after a few hours messing around I was able to solve my problem. I'll just tell you guys what I have any pack that is facing the same problem, I got in the future.

    After that I had this moment where I expected to find, how have I not think of this before?

    Basically if you look at the first image I posted above I put 1 part of the dark line on the left image and the white line on the Middle image. This caused a problem when the page has been updated to the scale about because the sides of the Middle image might get cut and so I lost the look indented.

    To solve this, I have simply returned to Photoshop, took all the lines out of the Middle image, and then I put the two lines on the left and the right image. Once I inserted the pictures in DW I had lined up on the left edge (for the photo on the right) and the right edge (left on the photo). This made sure that, even if the sides got "cut" as page scaling, the other would stay in place.

    My page is now able to scale properly with the background image remains in the right place.

    In addition to "spend addition" gutters and remove rules space, I found that I had to just go into my CSS in each of these boxes and set light to the times, left or right. This definition seems to forget that the gutters were there and so my divs go next door.

    Thanks for all the help guys gave. It got me thinking and helped me to find this solution.

  • CS6 fluid grids - how images to resize when the page is resized? [was: Hello]

    I am new to fluid layouts in Dreamweaver cs6 grid, I want to insert a GIF file on my index page but I don't know how to make when the page shrinks the GIF or image shrinks as well. The only code that I found is

    IMG, {}

    Max-width: 100%;

    }

    But this code already exists in the css file when you create a new fluid page layout grid in function

    IMG, object, embed, {video

    Max-width: 100%;

    can someone help a newbie please...

    I fixed it thank you all for the answers

    front

    kylechildressanimation

    After

    kylechildressanimation

    This fixed thank you

  • How can I place a div not transparent in a div transparent semi for a fluid presentation grid in dw cs6

    I am very frustrated I was looking for a solution to my problem, I am trying to place a non-transparent div, in a div transparent semi for a fluid page layout grid in Dw cs6, so far, I found no resolution is a way to do, I've attached a screenshot of my layout, everything I already looks exactly how I want it and it works perfectly with the checkerboard to fluid, with the exception of the white box. The area in white, I want to be opaque. Is there a way to do it and have it still work correctly as a checkerboard to fluid? Any help will be greatly appreciated!

    screenshot.jpg

    Opacity of the effect everything, including the containers & text inside.   To better control the opacity of the background, use RGBA colors.

    {#divName}

    background: rgba (255,255,255,0.4)

    }

    Nancy O.

  • Fluid design layout is still supported in 2015?

    I'm confused by the references to bootstrap.  Can I use fluid layouts in the new version?

    Thank you!

    Yes, but they are now considered "Legacy encoding" (Adobe Wizz you to use a bootstrap instead, especially for new sites).

    You can always change them as fluid grids (without design view), but it would probably be best to start over with Bootstrap, it is a much more powerful framework (and hopefully, less glitch) and has both living and design views available.

    It is not known how long they will keep the ability to change the "Legacy Code" in the program.

  • Padding, borders, and Nested divs in fluid layouts grid Cs6

    In working with the fgl cs6, you can nest the divs effectively? He says clearly that you can't, but I tried anyway and managed somehow. Handles appear, and you can resize. How is that? However, Im confused about adding padding or borders without throwing off the grid. DW Adds padding rather recalculation. I know that you can style of the content, but how you style the div? Thanks in advance.

    Well, to summarize everything if this place, so that the design view certainly has its styles of rendering issues, there's a way for anyone who needs it.

    If you try and fill or border to any fluid grid div, design view does not well she, but she adds your styles to an empty div, inside the fluid div, it allows to achieve the result expected in design mode. I saw it in another post.

    . Padding {padding: 5px; border: 5px solid #000 ;}}

    / * Mobile layout: 480px and below. */

    .gridContainer {margin left: auto; margin-right: auto; width: 100% ;}}

    #LayoutDiv1 {clear: sentences; float: left; margin-left: 0; width: 22.4719%; display: block; background-color: #9F0 ;}}

    #LayoutDiv2 {clear: none; float: left; margin-left: 3.3707%; width: 22.4719%; display: block; background-color: #F00 ;}}

    #LayoutDiv3 {clear: none; float: left; margin-left: 3.3707%; width: 22.4719%; display: block; background-color: #006 ;}}

    #LayoutDiv4 {clear: none; float: left; margin-left: 3.3707%; width: 22.4719%; display: block; background-color: #600 ;}}

    This is the content of the div layout "LayoutDiv1."

    This is the content of the div layout "LayoutDiv1."

    This is the content of the div layout "LayoutDiv1."

    This is the content of the div layout "LayoutDiv1."

    Close enough. Four div tags with a reasonable Design view rendering and the fill and border. Otherwise, you can also style the content to get the same result.

    Design view


    Live View mode

  • Grids - How can I use the fixed px gutters?

    Hello

    I'm new to the edge of reflow and looking to incorporate it into my sensitive design process.

    Basically, I want to put fixed gutters in a fluid mesh and the "Gutter width" field is only in percentages.  Is it possible to change this?  My drawings will often present a fixed width of gutter that is also found in other areas of the design. For example if my width of the gutter is 32px then I'll use 8px/16/32 as padding for containers or the vertical margins between the rows.  When to get the margin is too large for the window, I use a division of that and reduce the other elements accordingly.

    Of course technically gutter % is more than a perfect fluid grid, but I almost always use fixed gutters with fluid containers!  Will this be integrated?

    Thank you

    Dave

    Hi Dave.

    For now, you are limited to the use of percentages here, you've discovered. The ability to give the user more flexibility with this is on our backlog, but I can't tell if and when we are going to implement this.

    Thank you for using reflow,

    VIC

  • Fluid gutter grid questions

    To use the new features of fluid grid, you must set a gutter for the columns. Does to styling a pain unless I'm missing something. You end up with this:

    Screen Shot 2013-09-17 at 9.06.54 AM.png

    I want to add a gradient background to separate columns 1 and 2. With a standard layout, I am not facing in the gutters, revealing the background content between the elements.

    There the work around for this s? I can manually build the fluid layout, but then I lose really clever can just click and drag around the elements visually in Dreamweaver design view.

    Thank you.

    FGrid layouts are a good jump start for the creation of suitable facilities. But if you want to drag a div around the screen, you have to accept their limitations.

    Use them for the process of creation of database layout.  Once you are completely satisfied with the basic configurations, you can manually modify code (if you must) to remove the gutter margins.  And use a separate stylesheet for your content.

    If/when you're exasperated with the limits imposed by the FGLayouts, there are several other executives & extensions to try.

    Bootstrap DMX area * free to the DW extension

    http://www.DMXzone.com/go/21759/DMXzone-bootstrap/

    Project of seven Page Packs * commercial CSS Templates *.

    http://www.Projectseven.com/products/templates/index.htm

    Zurb Foundation

    http://Foundation.ZURB.com/templates.php

    Reusable skeleton

    http://www.getskeleton.com/

    Initializr (HTML5 Boilerplate, sensitive or "bootstrap")

    http://www.Initializr.com/

    Wish I was a better arrangement for the production of false columns and control the background of each div.

    Columns height script:

    http://www.Projectseven.com/Tutorials/CSS/pvii_columns/index.htm

    Nancy O.

  • Edge to edge using fluid background grid Layouts

    Hello


    I create a new site using fluid grid Layouts.  I have a background image of 1366 x 1000 px, in the file main.css (see below), placed but I would like to find a way that the background going edge to edge on any device, as is the style more modern.

    . gridContainer.clearfix {}

    background-image: url (.. / images/header_bkrd3.jpg);

    background-repeat: no-repeat;

    }

    Thanks for your help in advance!

    PB

    . gridContainer.clearfix {}

    Background: url (.. / images/header_bkrd3.jpg) no rehearsal Center set.

    -webkit-background-size: cover;

    -moz-background-size: cover;

    -o-background-size: cover;

    background-size: cover;

    }

Maybe you are looking for

  • NB305-106 - lack of KBCSL.dll

    After a fake intivirus Palladium Pro infection and clean my NB305-106 with Malwarebyte s, the following alert is displayed at startup: "C/user.../Local/KBCSL.dll, the module cannot be found" (translation from the french message). I can't find any ref

  • Music in gray: unavailable article - this article cannot be read

    I get this error that drives me crazy, I had a lot of songs greyed out with error point is not available. I tried to look for a solution and read some of the previous discussions, tried ALL of them, toggle iCloud library - Sign out/in - uncheck/check

  • Satellite 2430: CD/DVD drive does not work - i/o error

    Hello all Toshiba people.i have recently bought a Toshiba Satellite 2430 for a very good price. One thing the carpet * a DVD - ram Uj - 810 drive does not work when I put in any type of cd or dvd, I get this errorF:\ is not accessible.The request cou

  • Portege R400-600 - Windows Vista Ultimate - power functions

    . Windows Vista Ultimate - Control Panel / programs & features / turn Windows Feature on / Off - it is impossible to turn on anything, because she always ends with an error "an error occurred during installation".

  • Civilization V will not play

    Recently I bought Civilization V for my pc. I have Windows XP. It seems to meet all of the requirements of the system, but the game only plays... what should I do?