Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • May 6, 2021 at 8:52 am #1298723
    yampieters

    hello

    1. here:
    https://jmcwebdesign.nl/duo/wp-content/uploads/2021/05/Screenshot_20210506-082409_Chrome.jpg
    the pic is not really touching the edges, which it should do.
    this is due to this code ive used in the quick css

    /* breedte op gsm*/
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .container {
padding-left: 10px;
padding-right: 10px;    
}
}

    now, this might be so for all text but not for this particular picture.
    how to tell the css to make an exception for this picture?

    nb: is it default in Enfold that the paddings on mobile are zero?
    it doesnt look so nice… wouldnt it be an idea to give the text on mobile phones default some padding? (in the core code i mean).

    2. here:
    https://jmcwebdesign.nl/duo/wp-content/uploads/2021/05/Screenshot_20210506-084223_Chrome.jpg
    i think the top margins quite big on the pages on a mobile.
    is there a way to reduce this?

    best regards, jelle

    • This topic was modified 3 years, 4 months ago by yampieters.
    May 8, 2021 at 9:43 am #1299096
    Rikard

    Hey Jelle,

    I can’t see the content which is in your screenshot, on your actual site. Could you post a link directly to where we can see the content which is in the screenshot please?

    Best regards,
    Rikard

    May 9, 2021 at 9:34 am #1299160
    yampieters

    hi rikard, i think ive choosen the wrong pic and url

    this is the one
    https://jmcwebdesign.nl/duo/wp-content/uploads/2021/05/Screenshot_20210506-082409_Chrome.jpg

    best regards, jelle

    May 11, 2021 at 5:03 am #1299519
    Rikard

    Hi,

    Thanks for that. You can try this CSS:

    @media only screen and (max-width: 767px) {
.responsive #top #wrap_all .container {
    padding-left: 0;
    padding-right: 0;
}
}

    Please note that all your content will stretch full width if you use it though, there’s no CSS which will affect only the image unfortunately.

    Best regards,
    Rikard

    May 11, 2021 at 8:19 am #1299587
    yampieters

    hi rikard, thanks
    unfortunately it didnt do anything,
    but as you are saying that all images would be affected it doesnt matter.

    so there is no way to point to a certain page to apply a rule?
    something like:

    @media only screen and (max-width: 767px) {
    page-duo-interieur .responsive #top #wrap_all .container { etc etc

    best regards, jelle

    May 12, 2021 at 7:05 am #1299840
    Rikard

    Hi,

    Thanks for the update. You can apply it to a single page only, yes. But the problem would still exist, your other content will also go full width, so I’m not sure it would be such a good idea to implement it in any way.

    Best regards,
    Rikard

    May 12, 2021 at 12:11 pm #1299904
    yampieters

    ok, for now we leave it like this.
    if in the future a change is needed we can talk again.

    this one can be closed now, thanks for your support anyway , jelle

    May 13, 2021 at 12:43 pm #1300130
    Ismael

    Hi,

    Alright. Please feel free to open another thread if you need anything else.

    Have a nice day.

    Best regards,
    Ismael

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘stretch picture to the edge on mobile’ is closed to new replies.