Skip to main content
N
NaviB2
Inspiring
August 6, 2013
Question

DW CC Fluid grid layout how to change px width for desktop layout

  • August 6, 2013
  • 1 reply
  • 14425 views

Hi there,

I have been going through the various tutorials about fluid grid layout and setting up our bureau's website in a responsive layout.

The width of the original design was 960 px and the hero pic and others have been exported at that size.

The first divs in the design look fine, header with the 960 px pic in it, and also the BC menu which is set to 960 wide.

However the body text goes out to the right, past the 960 px and this is because, right at the start, when starting the file in DW the desktop screen width is set to 1232px.

How can you change this setting when starting a new fluid grid layout?

I have tried changing the number of columns, or the percentage, and the width for desktop remains at 1232px.

Why is this?

Not all of our clients want a site 1232px wide on a pc.

Thanks so much.

This topic has been closed for replies.

1 reply

BenPleysier
Community Expert
BenPleysierCommunity Expert
Community Expert
August 6, 2013

Please supply a link to the site.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
N
NaviB2Author
Inspiring
August 7, 2013

Hi Ben,

Thanks so much for your reply! I am not finding many people who are trying out the DW CC responsive design so I really appreciate this.

Here is the link to the page with the responsive template attached to it. For some reason it is no longer centered so it looks like the auto right auto left is no longer working. http://rangsgraphics.com/Home

The responsive template is only applied to this one webpage, which is a duplicate of the home page. If you click on any menu links, you will be on a webpage with the current template which has a wrapper, auto left auto right, containing divs at fixed width floating left. The old way that I need to move on from!

I also remember now that I put a right hand margin on the body to try and line it up with the header, which I know is wrong, but I couldn't work out how else to change it. However, you can see that the BC menu is expanding out to the full width of 1252 px wide.

So its back to my question - how can I set the PC version of the responsive site to 960 px as the max width? It looks like 1252 is set in concrete in DW CC at the moment. If that is the case, I guess I can do all website designs for clients at that max width and export the images for the design at that width.

BenPleysier
Community Expert
BenPleysierCommunity Expert
Community Expert
August 7, 2013

Hi Mary,

I had a look at the CSS and became completely confused.

May I suggest that you start with a new document rather than fiddle with a current document. To help you with a fluid design you could use this free extension found here http://www.dmxzone.com/go/21759/dmxzone-bootstrap/

I had a look at using the extension, I did have to put a limit on the body element as in

body {

    max-width: 950px;

    margin: auto;

}

The rest was fairly straight forward.

I use the Foundation framework for all of my work. This can be found here http://foundation.zurb.com/

A pity that you were not a week earlier, I have just returned to Melbourne after spending three weeks in Ardross. I could have paid you a visit.

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
Terms & ConditionsAccessibility statement
Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices