[Resolved] Image span 100% (again)

Home Forums Support Image span 100% (again)

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #126720
    Reto Suter

    Hi

    I did try some of the topics of this forum, but none worked for me.
    I would like to have an image, on 100% of page width. I tried site with sections and without, image as background or head.
    it should work on desktop and mobile.

    GP-Version: actually, with all ad-ons
    Website:
    http://www.vtag.ch (image is in header)
    http://vtag.ch/wp/weichen (image as backgroud in section)
    http://vtag.ch/wp/?page_id=1200 (image as background in section, padding 400+, image is bigger than site)

    thank you and regards

    Reto

    #126838
    Tom
    Lead Developer
    Lead Developer

    Give this CSS a try (for the image in header):

    .page-header-image.grid-container {
          max-width: 100%;
    }
    
    .page-header-image.grid-container img {
          width: 100%;
    }

    Let me know if that does the trick or not 🙂

    #127178
    Reto Suter

    HI

    It does it, thank you!
    Is it possible to have the same size and put text in it without auto-changing the size?
    If i use the header text, it goes just as height as the text itself.

    thank you

    reto

    #127245
    Tom
    Lead Developer
    Lead Developer

    To add text you’ll need to add the image as a background image which gets tricky when it comes to sizing.

    You can use padding to increase the height of the element, but you may need to add CSS to adjust the padding/background image on mobile and tablets.

    There’s no exact science when it comes to background images – just lots of tweaking and testing.

    #127248
    Reto Suter

    Hi
    thank you for your reply. So i try some.

    Regards

    Reto

    #134378
    Evie

    Background image position instructions, can you tell me or give me an example of what to put in the position input box, it is unclear to me as to what it requires? All of these parameters or one? can you give me an example please?

    left top, x% y%, xpos ypos (px)

    #134380
    Evie

    Background image position instructions, can you tell me or give me an example of what to put in the position input box, it is unclear to me as to what it requires? All of these parameters or one? can you give me an example please?

    left top, x% y%, xpos ypos (px)

    I would like my small logo(220pxx220px) to appear on the left hand side in the background.

    #134384
    Tom
    Lead Developer
    Lead Developer

    Check out the property values on this page: http://www.w3schools.com/cssref/pr_background-position.asp

    You can use any of those values 🙂

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.