• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Dreamweaver CC -- Media Queries not working ?

New Here ,
Feb 18, 2018 Feb 18, 2018

Copy link to clipboard

Copied

Created desktop site via Dreamweaver using HTML5 and CSS. That WORKS.

The ISSUE comes with MEDIA QUERY CODING  !!  

Why are the media queries not bringing responsive sites for mobile and tablet?

Should query be composed of 'each section' shown on the desktop CSS, but given adjustments on percentages / pixels to mobile size and tablet size??

To have MOBILE responsive: Create One lengthy query for each section on Homepage -- One lengthy query for each section on Graphic Design page -- One lengthy query for each section on Illustration page -- One lengthy query for each section on Textile Design page -- One lengthy query for each section on About page.

-------- The Graphic Design, Illustration, and Textile Design pages each have a slide show consisting of six images.

When all that query coding for mobile's site is completed, then must code for TABLET's responsive site !! ??

TWO WEBSITES !!  ?? beyond the desktop site !! = Three Websites.

Do Fluid Grids create responsive web development automatically?

Is there a book that explains how Media Query should be written for several pages on a website for mobile and tablet?

Does Adobe Classroom in a Book for Dreamweaver CC 2018 explain how to Code Media Query for several pages ?

MaryAlice

Views

1.2K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 18, 2018 Feb 18, 2018

Copy link to clipboard

Copied

LATEST

I suggest you read the chapter below on Responsive Web Design. 

Responsive Web Design Introduction

I don't recommend using legacy Fluid Grid Layouts.  Adobe removed that feature from DW CC for a reason.  

If you can work with code, Bootstrap is a responsive framework for creating one website that displays well on all devices -- xs, sm, md & lg.

Bootstrap 3 Tutorial

Bootstrap is integrated in DW CC.   The quickest way to get started is with the Starter Templates in DW CC.

Go to File > New > Starter Templates > Bootstrap Templates.

Choose a layout & hit Create button.  See screenshots.

CC-StarterPage.jpg

Save As index.html.  DW will create Assets and files for you in your local site folder.

CC-StarterPageAssets.jpg

You should now have a responsive web page that works in all device widths.

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines