Banner/showcase maximum width

[Sarah McDowell]

I would like to know more about what the following items in the style.css file mean:
#showcase {
max-width:1170px;
margin: 1% auto;
padding:1% 5%;
background-color: #934e49;
}
#banner {
max-width:1920px;
margin:auto;
}
#wpheader {
max-width: 1170px;
margin: 1% auto;
padding: 0 2%;
background-color: #934e49;

Can I adjust these to make the showcase area a bit more narrower from top to bottom? When you say max-width does this refer to the width from left to right or from top to bottom? It’s not absolutely necessary, but if possible I would like to make the showcase and banner just a tad smaller so that the words of my website will be visible for people to read before they have to scroll down.

[Sushil Adhikari]

The containers around the images or sliders can be adjusted by the theme options under the Header Image tab in the customizer. This will control the spacing (paddings). The height is based on what image or slider height you use…so if your image is 600px in height, the showcase or banner area will adjust to it automatically. For sliders, they usually have a height setting which does the same.

Max-width means that is as wide as the container area will go. So whatever these are set, that will be the maximum width.

[Sarah McDowell]

Thanks Andre, this is brilliant! I just made the showcase height smaller by uploading a slightly smaller photo of myself. My purpose was to have more of the written content below the showcase appear to clients when they first arrive at the website.

[Author]

Posts