The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design Make Image Adjust to Viuewport

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • #267787

    I’m using the css below to set the height of the div with a class of “.intro”. It works fine for me:

    * {
    box-sizing: border-box;

    body {
    margin: 0;
    font-weight: 500;
    font-family: ‘HelveticaNeue’;

    section {
    width: 100%;
    padding: 0 7%;
    display: table;
    margin: 0;
    max-width: none;
    background-color: #373B44;
    height: 100vh;

    &:nth-of-type(2n) {
    background-color: #FE4B74;

    .intro {
    height: 90vh;

    .content {
    display: table-cell;
    vertical-align: middle;

    However, i’d like to make the background image of the div to adjust to the viewport height. Any guidance appreciated. Thanksl


    There isn’t an image in the code sample you provided, but have a look into the background-size CSS property.

    For specific help, please create a reduced demo in CodePen using just enough HTML and CSS to clearly show any problems you’re having.

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘Design’ is closed to new topics and replies.