SLUGSoc / website-old

3 stars 1 forks source link

Fix layout at higher resolutions #26

Open boardfish opened 6 years ago

boardfish commented 6 years ago

More difficult for me as I don't have a 4k screen (repsonsive view mode, I know), but needs doing.

robjtede commented 6 years ago

Max width layouts is okay. 1200px is typical.

Aterfax commented 6 years ago
.container-fluid {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 1440px;
}

Seems reasonable to me.

Additional background colour or pattern may be required

Example:

image

e.g.

background-color: white!important;

or

background-image: url("assets/images/funky-lines.png")!important;
background-repeat: repeat-y;

Shadow elements for edges of central column:


-moz-box-shadow: 1px 2px 3px rgba(0,0,0,.5);
-webkit-box-shadow: 1px 2px 3px rgba(0,0,0,.5);
box-shadow: 1px 2px 3px rgba(0,0,0,.5);

With:

image