Skip to main content
S
Skies4ever
Participant
January 22, 2018
Answered

Dreamweaver CC 2015: Browser Adjustment

  • January 22, 2018
  • 2 replies
  • 419 views

I have been having an issue when it comes to my web preview rearranging my content when I change the size of the browser and when I use the site on other computers with varying screen sizes. All I want to do is make it so it is all consistent across all platforms. I have been coding it using HTML and CSS rather than using the design feature.

If anyone could help make the items static that would AMAZING! Thank you for your time.

This topic has been closed for replies.
Correct answer Nancy OShea

skies4ever  wrote

All I want to do is make it so it is all consistent across all platforms.

If anyone could help make the items static that would AMAZING!

Sorry but a one-size-fits-all approach doesn't work in modern web design.  A desktop layout won't fit smaller mobile devices as there's not enough screen space.  And a mobile layout would look mighty silly on desktops.  So what you think you want and what your site visitors actually expect are 2 completely different things.   See screenshot.

Learn all you can about responsive web design with CSS media queries.  

HTML Responsive Web Design

Optionally, you could use a responsive framework like Bootstrap which is built-in to Dreamweaver.

Bootstrap 4 Tutorial

Or you could purchase a commercial layout like this one from Project Seven.

PVII CSS Affinity: Responsive and Mobile-Ready layouts for Dreamweaver

Nancy

2 replies

Nancy OShea
Community Expert
Nancy OSheaCommunity ExpertCorrect answer
Community Expert
January 22, 2018

skies4ever  wrote

All I want to do is make it so it is all consistent across all platforms.

If anyone could help make the items static that would AMAZING!

Sorry but a one-size-fits-all approach doesn't work in modern web design.  A desktop layout won't fit smaller mobile devices as there's not enough screen space.  And a mobile layout would look mighty silly on desktops.  So what you think you want and what your site visitors actually expect are 2 completely different things.   See screenshot.

Learn all you can about responsive web design with CSS media queries.  

HTML Responsive Web Design

Optionally, you could use a responsive framework like Bootstrap which is built-in to Dreamweaver.

Bootstrap 4 Tutorial

Or you could purchase a commercial layout like this one from Project Seven.

PVII CSS Affinity: Responsive and Mobile-Ready layouts for Dreamweaver

Nancy

Nancy O'Shea— Product User & Community Expert
Jon Fritz
Community Expert
Jon FritzCommunity Expert
Community Expert
January 22, 2018

You could fix the width of your <body> element with css, and the contents should stop re-flowing.

However...

That's generally considered the opposite of what you want to do in web design. These days, we use CSS Media Queries to reflow a web page for specific break points (steps in screen sizes), along with fluid designs (set in % widths), to give a better experience than a static page that needs to be swiped and pinched in order to navigate on small screen devices.

Either way, it's difficult to give you any specific help without seeing your work in progress.

Could you post a link to your page so we can take a look with our browsers?

Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices