STACKS

demos

Scale your browser window to see how the 4 PADDY settings below, respond to the height & width of the browser. Below is a PADDY2Col stack holding 2 more PADDY2Col stacks to create a 4-Column stack. Each column contains a PADDY stack and each is set to a different colour and configured as indicated.

50% Height

50% Parent

25% Width

50px

Note that the parent height uses the height derived from whatever is considered as the "parent" container. If this setting doesn't produce the expected result, just use one of the other settings.

This demo below shows a PADDY3Col with a PADDY2Col in each column. The PADDY2Col is set to collapse above 700 and below 500.

PADDY2COLSTACK

COLUMN 1 inside Col 1 of 2Col

PADDY2COLSTACK

COLUMN 1 inside Col 2 of 2Col

PADDY2COLSTACK

COLUMN 2 inside Col 1 of 2Col

PADDY2COLSTACK

COLUMN 2 inside Col 2 of 2Col

PADDY2COLSTACK

COLUMN 3 inside Col 1 of 2Col

PADDY2COLSTACK

COLUMN 3 inside Col 2 of 2Col

Scale your browser window to see how the 8 PADDYCol settings below, respond to the width of the browser. Below are 8 standard Stacks3 1-Column stack, each inside a PADDYCol stack each set to a different colour and configured as indicated. All set to max width of 1440px unless otherwise indicated.

PADDYCol set to 80% and 769px

PADDYCol set to 50% and 769px

PADDYCol set to 90% and 600px

PADDYCol set to 60% and 900px

PADDYCol set to max width of 800px

PADDYCol set to max width of 300px

PADDYCol set to 80% and max width of 1000px and breakpoint of 500px

PADDYCol set to 80% and max width of 1900px and breakpoint of 769px

CONTACT WEBDEERSIGN

Sign up for the Webdeersign Newsletter

  • WEBdeerSIGN Twitter
    WEBdeerSIGN Twitter
  • WEBdeerSIGN Twitter
    WEBdeerSIGN Twitter
  • WEBdeerSIGN Twitter
    WEBdeerSIGN Twitter
  • WEBdeerSIGN Twitter
    WEBdeerSIGN Twitter