Fluid grids & IE8 - PLS HELP!

Similar Questions

• IE8 question: fluid grid/reagents nav bar - cancel or in css overide?

  For a sensitive Bootstrap site: how to replace the fluid grid and the foldable navbar on a separate stylesheet for IE8 to render the page not compliant? Is it a question of weight or destroy?

  Respond.js may address other elements of "screen" for IE8, assuming that no one with a smartphone or Tablet using IE older browsers in any case.

  But if someone could give me a branch of How to deal w/ the navbar and grid of fluid in the css without modifying the markup in my doc, I would be grateful to him

  Do you really need support IE8?  Very few people still use it.

  If you are compatible with IE8, create a style sheet IE only with your office layout styles.  Insert it inside a conditional comment for browsers of pre - IE9.

  Don't forget to insert this after all other styles and style, sheets just before your closing tag.

  Nancy O.

• helps to create a fluid grid / muse of tile layout

  Hello, I am new in muse and try to create a fluid grid presentation.

  I want to achieve is the images rearrange dependent selves on their size. I've seen this in a few other places, like this is the case here...

  ZAVEN - Zaven is a design, research, and communications studio based in Venice, Italy.

  As you will see, depends on the size of the browser window, the images rearrange to fit.

  It is a website created in wordpress. And if I can recreate this kind of tile / grid Muse would be great.

  I've also attached a few images, showing the effect I want to achieve, these images are from my email client, I like the way the window rearranges literally just the images to fit.

  

  If anyone out there knows how to achieve that would be great...

  Kind regards

  Andrew

  In Muse can make a checkerboard to fluid. You can manually set the breakpoints and manually change the location of the content in each breakpoint.

  Watch this tutorial Responsive web design in Adobe Muse | Adobe Muse CC tutorials

• How to build a model dreamweaver help than a fluid grid.  My file/save model is grayed out and will not aloow me to save my site as a template page.  Thank you

  Can I do a fluid grid layout template.  If yes how to accomplish this?

  It does not strip the CSS from your code.  If done correctly, deceive you DW thinking that it is a non fluid grid which allows to use design mode.

  Just add an X to code CSS FluidGrid that generates DW for you when you create a new FGLayout.

  Properties Grid Dreamweaver fluid

  ----------------------------------

  DW-num-CLO-mobile: X 4;

  DW-num-CLO-Tablet: 8;

  DW-num-OCOL-Office: 12;

  DW-gutter-percentage: 25;

  =====================================

  To do this, you must manually change the CSS code in Code view. Record. DW to close and reopen DW.

  To return to the mode of FGLayout, you will need to remove the X.  Record.  DW to close and reopen DW.

  Nancy O.

• Don't see fluid Grid Layout in Dreamweaver cc of the trial

  I downloaded the Dreamweaver CC to see how the new fluid grid works however it dose not give me the opportunity to try it?

  Fluid grids now carry the moniker "fluid grids (legacy)" they should not really be used. It is clear that Adobe does not offer a lot of support for them to proceed.

  If you have PCOC 2015 (check what version you have under help > on Dreamweaver) when you hit file > New in the dialog that appears you must click on the new Document tab at the top left. This will give you a list of the types of documents, fluid grid (inheritance) is the last option at the bottom. Make sure that the 'None' tab is selected on the right (mixture LFGL and Bootstrap basically will implode your site, so don't do it).

• Page when enlarged kicks / fluid grid Video resize

  I have some problems with my foot on this page: http://pauldhart.com/tf_teaser.html

  I applied the code to allow for the video, incorporate scalability in the fluid grid and the footer is in the EXACT right place when the window is reduced in size, however, when that maximize the footer jumps down below the scroll.

  I guess it has something to do with my code for the video scaling, since it disappears when I cut this CSS but I can't identify the problem.  Here is the code in question.

  HTML PART:

  < div id = "contentbody" >

  < div class = 'container-video' >

  " < iframe src =" Byline = 0 & portrait = 0 & https://Player.Vimeo.com/video/128816726?color=f6ecca "width ="500"height ="281"frameborder ="0"allowfullscreen mozallowfullscreen webkitallowfullscreen > < / iframe > "

  < / div >

  < div id = 'fb-root' > < / div >

  < script > (function (d, s, id) {})

  var js, SJF = d.getElementsByTagName (s) [0];

  If (d.getElementById (id)) return;

  js = d.createElement (s); js.ID = id;

  js. SRC = "/ / connect.facebook.net/en_US/all.js#xfbml=1";

  fjs.parentNode.insertBefore (js, SJF);

  (} (document, 'script', 'facebook-jssdk')); < /script >

  " < div align ="left"id ="footer"> < div class ="fb-like"data-href = ' http://Facebook.com/threefingersmovie "data-width ="330"data-colorscheme = data-show-faces of the 'light' = 'false' data-send ="true"> "

  < / div >

  CSS PART:

  {#contentbody}

  Clear: both;

  float: left;

  Width: 100%;

  display: block;

  margin: 0px;

  padding: 0px;

  box-shadow: 3px 10px 20px #000;

  max height: 600px;

  }

  .video-container {}

  position: relative;

  padding-bottom:56.25%;

  padding-top: 30px;

  height: 0;

  overflow: hidden;

  }

  . Video-container iframe, .video-container object, container-.video incorporate {}

  position: absolute;

  top: 0;

  left: 0;

  Width: 100%;

  height: 100%;

  max height: 600px;

  }

  If you follow the link above and resize the browser, you will see the question.  Any suggestions would be very helpful!  Thanks guys/girls.

  The problem is caused by padding-bottom on the container-video class. When the fill is specified as a percentage, the value is always calculated the width of the parent element. This applies not only to the horizontal padding, but also vertical filling. Therefore, the page becomes, more the footer is pushed away from the video.

  The solution is very simple. Once the video has reached its maximum height, you must change the fill from the bottom to a fixed value instead of a percentage. Add this to your style sheet:

  @media screen and (min-width: 769px) {
     .video-container {
         padding-bottom: 576px;
     }
  }
  

• 100% width div inside the fluid grid

  Hi im trying to find the best way to use the transmission grid in Dreamweaver.

  One problem im having is if my fluid is width 90% how to make a DIV to work 100% in width but have the DIV stay nested in the grid?

  I installed the header and footer to run 100% outside the gate, but I now have a few DIVS that go through the page and I'm not sure how I can run 100% without changing the grid at 100% width.

  Any help would be greatly appreciated.

  Thank you

  Luke

  

  Fluid grids are not 100% width for a reason.  They are designed to be centered on the screen and you can not do it with 100% divs.

  I understand what you want - maybe as in this example of custom code:

  ALT - Web: Severed CSS Layout

  Due to some limitations, FGLayouts are not the best way to achieve this.

  If you want to give your FGLayout origins, you could get an acceptable effect with gradients of background CSS selector of your body that covers the entire page.

  {body

  background:-webkit-linear-gradient(white, maroon). / * For the Safari.

  background:-o-linear-gradient(white, maroon). / * Opera * /.

  background:-moz-linear-gradient(white, maroon). / * For Firefox * /.

  background: linear-gradient(white, maroon). / * W3C Standard * /.

  filter: progid:DXImageTransform.Microsoft.gradient (startColorstr = 'white', endColorstr = "Brown", GradientType = 0); / * IE6-9 * /.

  }

  Nancy O.

• DW CS6 - best fluid grid multilevel MENUS for scaling mobile (big site)?

  Hi I currently have a non-mobile-friendly site that contains 450 + pages (www.midlifebachelor.com), and my search rankings go wrong to cause not to be mobile-friendly.   I use Dreamweaver CS6 on the Windows 8.1 as a development platform and would like to stay with her.  [I have also a site different, much smaller that I recently successfully migrated to a fluid grid layout, and it works very well... and that was my experience very first/only with grid encoding, using DW CS6 fluid.]

  So I need migrating my site page 450 + big a checkered to fluid and I have several problems to solve - the first / most obvious are to know how to deal with some of the complex menus. Today as top-level menus, I have reversals of the image at the top of every page of my site, for a customized mobile version running desktops, tablets and mobile devices - I tried (on different threads here) and one that seems to meet my needs the most is the 'Vertical Drop Down Mode"projectseven:

  http://www.Projectseven.com/products/templates/pagepacks/DMM/affinity/menu-modes/index.htm

  Some menus multi-level migration is important to me because many of my existing main/top level (currently image hover) menu selections now go to pages that contain Spry tabs - which go far.   So the migration of pages with these Spry tabs in new multi-level menus (using checkerboard to fluid, etc.); those without something complex on the landing page would be one level of menu in the upper part.   Goal is to have a system menu unique uniform at the top of each page of the site page 450 +.

  As my site is so great, I clearly don't want to modify the code any time soon the whole site (once I do it immediately, using the menu system above or?).   I want to test my design as much as possible.

  MY QUESTION to THE GURUS - do you think that the "Drop Down Mode Vertical" Projectseven is a very good choice for me to migrate to (for the multi-level menus, using a fluid grid - for scaling of the bureau, to table for mobile)?   Are there other choices that I have to look?  [If there is something different that I should, can you please give me a link that shows examples for this?]

  Thank you very much for your time!

  MLBdesigner wrote:

  (2) another section of the site is more like a book - so not as a collection of independent articles (as with the link you quoted above), but more like 100 pages of content that is usually read in order.  The player has the opportunity to watch an 'index' on the right side of the page that contains links that allow the reader to move from things that are of interest.  Example:

  It's exactly the same principle. Think of each page of the book stored in a column of data.

  You have 1 book page on the site with the index of linked pages / registered associated will be filled with data. According to link (page) is chosen by the user that it is then retrieved from the database in the database identification number that is attached to the link of the page-based.

  This all sounds quite complicated I don't know if you have little experience of database. But if you take the time to research - master-detail in Dreamweaver pages it might help you better understand the principle and how your needs would adapt.

  I don't know how effective the information below are to the current version of DW, but it explains the procedure:

  Using Dreamweaver | Main and detail page design

  MLBdesigner wrote:

  So the above is the other half of the site that I need an approach to understand.  The mobile aspect where it migrates to probably means that I lose the index on the right that allows the reader to spend.  If anyone has any ideas or suggestions on how to manage this migration to something easy to mobile, then I'm all ears.

  You might just have a single link "Choose a Page" at the top in mobile, BUT it's a heck of a lot of links to scroll down, or you can break it down into manageable chapters.

• Fluid grid Tablet: hidden divs live show

  I'm new to model fluid grid, but I use Dreamweaver CS6 and I understand that the mobile CSS reverberates down to Tablet, and then to the office. However, I thought that I could hide divs by adding display: none; the CSS code in the view of the tablet. When I do this, it works very well in edit mode. Looks quite right. But when I check the live and browser hidden div view (s) is clearly visible, for example:

  
  

  I have 3 divs and I want everyone to be visible in only a point of view.

  
  

  Div 1 = #mobile

  Div 2 = #tablet

  Div 3 = #desktop

  
  

  I have do this in CSS:

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

  {#mobile}

  Clear: both;

  float: left;

  left margin: 0;

  Width: 100%;

  display: block;

  }

  {#tablet}

  display: none;

  }

  {#desktop}

  display: none;

  }

  / * Tablet Layout: 481px to 768px. Inherits the styles of: Mobile layout. */

  @media only screen and (min-width: 481px) {}

  {#tablet}

  Clear: both;

  float: left;

  left margin: 0;

  Width: 100%;

  display: block;

  }

  {#mobile}

  display: none;

  }

  {#desktop}

  display: none;

  }

  }

  / * Office Layout: 769px to a maximum of 1232px.  Inherits the styles of: Mobile and tablet. */

  @media only screen and (min-width: 769px) {}

  {#desktop}

  Clear: both;

  float: left;

  left margin: 0;

  Width: 100%;

  display: block;

  }

  {#tablet}

  display: none;

  }

  {#mobile}

  display: none;

  }

  }

  Everything looks good in edit mode. But when I see it alive, mobile is fine, office is fine, but Tablet view includes any mobile even if it is not supposed to show.

  What I am doing wrong? Any help is greatly appreciated, and I can add my real code if necessary.

  Thank you!

  In your liquid - grid.css, line 124, you have a useless (and invalid) "}". This prevents the other CSS is expressed.

• The fluid grid columns disappeared. How to make a comeback?

  I need help for the fluid grid columns is displayed.

  

• How to Center a div in fluid grid?

  Im not able to focus whatever it is in a fluid grid. I want to set the max width on something and then Center it but "margin: 0 auto ' does not work.

  Hi, try something like this:

  #container {}

  display: block;

  Width: 100%;

  float: none;

  left margin: auto;

  margin-right: auto;

  Max-width: 960px;

  }

  I hope this helps.

  Alex

• Creating fluid grid templates

  I have a very large site for a real estate company that I sold as a RWD. They have 175 pages or lists.

  I have a good handle on the DW grid design tools of fluid. When a try to create a DIV inside an editable area of the DIV loses it's grid commonly features like copy, hide, sizing, etc..

  Anyone working with models and grid of fluid of DW. Is there a way around this problem. For any help or suggestion would be appreciated.

  Thank you

  dlipscombe

  I'm still able to get the fluid grid HUDs inside an editable area.

  

  Can you try to activate the mode live view and see if you can get the HUDs?

  Keep us informed.

• fluid grid tools do not work after that I moved a page to a new Directory/site

  I implemented a simple enough fluid grid, which works great.  Then I moved the files to a new directory.  I had to remove a slash in front of one of the links to the css file I use for formatting of the text and what not, but the page still works fine.  My problem is that I now have a plus a few changes, but when I click on the divs etc in design mode, I don't see more fluid grid tools or the little icon in the toolbar to turn it on or off.

  My apologies if I forget something obvious, but any suggestions would be appreciated.

  Thank you

  PRH

  It's working now.  It seems that the problem was related to a couple unrelated files css fg left by a previous attempt.  I cleaned these, and voila, my tools returned fg.

  Thanks for your help.

• Is it possible to create a model using fluid grids?

  I'm working on a new site and now starting to really try and arrange everything correctly, so what I want to do is to create a master page to work from universal.  I understand that this is not a master page as such, I read that you need to create a template and a link to that, but I don't see how to do this with a checkerboard in fluid.

  Is it possible to use fluid grids, keeping a 'template' link to and do NOT have to redo all the work I've done so far?

  Thanks for any help in advance =]

  Read F1 help on DW models to gain an understanding on how they work.

  1. Make your prototype of FluidGrid page.  Check in all browsers, and when you are satisfied of how it looks and reads the file save as Template.dwt.
  2. Add editable regions for things that will change the page.  Save and close the template.
  3. Go to file > new model page.  Press the button create.
  4. This new file is a page of the child.  SaveAs index.html (your home page) or a different file name.
  5. Repeat steps 3 & 4 for your other pages of the site.
  6. Re-open the model and add links to your navigation menus.
  7. Save the model and fill changes to the child pages.
  8. Child pages look in browsers before uploading to your remote server.
  9. Repeat steps 7 & 8 whenever you make changes to your file main template.dwt.

  Nancy O.

• Can you add a video to a fluid grid project in CS6

  Hi again;

  I think of the CS6 upgrade to help with my video problem in CS 5.5 and I was wondering if you can add video to a web project of fluid grid.  Of that I looked on the web, it seems that everything is a web site to a page with links to an area on the index page.  I need to get the video into my site as examples of what I'm doing and the fluid grid is superb.  I also suspect that I could put a link to a site of videos like Vimeo.

  Thanks for your help.

  Tom

  wondering if you can add video to a web project of fluid grid.

  Sure.  You can drop your own HTML5 videos or embed Vimeo, YouTube, etc...

  Of that I looked on the web, it seems that everything is a web site to a page with links to an area on the index page.

  Not true.  jQuery Mobile and fluid grid Layouts differ a little, not to get confused.

  JQuery Mobile is essentially a website a page for mobile devices.

  With fluid grid Layouts however, you can make a layout of reagent website in a few minutes, then save as template.  Use file > new template page to create the rest of your site pages. Or, you can use the jQuery tab panels inside the fluid grid layouts.  It is entirely up to you.

  Nancy O.