Background Size / Min-Width

Home Forums Launch Pad HTML Background Size / Min-Width

This topic is: not resolved

This topic contains 3 replies, has 2 voices, and was last updated by  Allan 4 years, 1 month ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #6749

    TourneDisque
    Participant

    Hi themecatcher,

    Is it possible to keep min-width from being ignored when the background image is 100% width and repeats-y.

    index.html
    <div id="img-overlay-effects" class="custom"></div>

    styles.css
    #img-overlay-effects {
    min-height: 100%;
    min-width: 837px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 0;
    background-repeat: repeat;
    }

    .custom {
    background: #000000 url(http://i.imgur.com/4UNT1SG.jpg) center center fixed repeat-y;
    background-size: 100% auto;
    }

    note: min-width is ignored.

    #6778

    Allan
    Support Staff

    You don't have permission to view this content. Please log in or register and then verify your purchases to gain access.

    #6783

    TourneDisque
    Participant

    Hi themecatcher,

    Yes, that is pretty much that the desired effect above but now is it possible to translate the same style into the other image code. Seems like I’d be so simple but my experiment fail and background repeat is now ignored.


    <div id="nojs-background">
    ""<!-- Non-JavaScript background -->
    </div>


    body {
    min-width: 837px;
    height: 100%;
    margin: 0px;
    }

    #nojs-background img {
    min-height: 100%;
    min-width: 837px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 0;
    background-repeat: repeat;
    }

    .js-enabled #nojs-background {
    background-size: 100% auto;
    }

    TourneDisque
    TC Member

    • This reply was modified 4 years, 1 month ago by  TourneDisque.
    • This reply was modified 4 years, 1 month ago by  TourneDisque.
    #6804

    Allan
    Support Staff

    You don't have permission to view this content. Please log in or register and then verify your purchases to gain access.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.