Max-Width not correct working

  • Resolved wpgeekde

    (@wpgeekde)


    6 years, 6 months ago

    Die max-with kann ich einstellen, steht default auf 500px. Das ist auch gut so.

    Wenn ich nun an einem mobilen Gerät mit beispielsweise 380px die Seite anschaue wird das Bild nicht runter skalliert und ist breiter als der Bildschirm (das Fenster, der Viewport). Ganz so als wäre hier nicht max-width sondern width gesetzt.

    Wie kann ich es erreichen das die Breite max 500px UND max 100% der Bildschirm-, Fenster-, bzw. Viewport-Breite ist?

    • This topic was modified 6 years, 6 months ago by wpgeekde.
Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Brecht

    (@brechtvds)

    6 years, 6 months ago

    Can you give me a link to a page with this problem?

    If you want things to be responsive you’d use something like this in your CSS:

    width: 100%;
max-width: 500px;
    Thread Starter wpgeekde

    (@wpgeekde)

    6 years, 6 months ago

    Thanks Brecht. The solution was a mix out of 2 things:

    1) I thought I need to set 100% as the max-width and not the width like you mentioned correct
    2) I needed to set the width:100px for “.vlp-link-container”. The issue was, that “.vlp-link-container” wasn’t defined in my css, that’s why all my attemps before failed.

    Is the “.vlp-link-container” in your default css? If not it makes maybe sense to add it with the width:100% !?

    • This reply was modified 6 years, 6 months ago by wpgeekde.
    • This reply was modified 6 years, 6 months ago by wpgeekde.
    • This reply was modified 6 years, 6 months ago by wpgeekde.
    Plugin Author Brecht

    (@brechtvds)

    6 years, 6 months ago

    It’s a div block element which defaults to width 100%. It’s possible your theme is overriding that.

    But happy to hear you got things working!

    Thread Starter wpgeekde

    (@wpgeekde)

    6 years, 6 months ago

    I wasn’t 100% correct…. don’t know why, but suddenly it wasn’t working.

    Here are now the working css parts, the bold ones I added:

    .vlp-link-image img{max-width:500px;width:100%;margin-right:10px;margin-bottom:10px}.
    .vlp-link-container{width:auto}

    with:100% for link-container isn’t working, auto is needed here. This is working in Firefox and Chrome (others I haven’t tested).

    Hope this helpes others with the same issue.

    • This reply was modified 6 years, 6 months ago by wpgeekde.
    • This reply was modified 6 years, 6 months ago by wpgeekde.
    • This reply was modified 6 years, 6 months ago by wpgeekde.
Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Max-Width not correct working’ is closed to new replies.