Offscreen element causing horizontal scrollbar

  • Resolved kaizerco

    (@kaizerco)


    6 years, 5 months ago

    There seems to be an input div that is extending beyond the page causing a horizontal scroll bar to appear. I believe it’s since the last update.

    <input class="ideapush-form-idea-attachment" name="fileToUpload" id="fileToUpload" accept=".jpg, .jpeg, .png, .gif" type="file">

    When I disable Width:100%; In frontendstyle.css – lines: 530 and 110 – it goes back to normal.

    In the mean time I added into my own CSS:

    #fileToUpload {
    width: auto;
}

    It’s odd though. I can’t find what is determining the specific width that causes it to go off screen.

    • This topic was modified 6 years, 5 months ago by kaizerco.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Northern Beaches Websites

    (@northernbeacheswebsites)

    Hi @kaizerco,

    Are you sure what you are saying is right? Because on your website this div element isn’t using that CSS anyway, this element uses:

    width: max-content !important; (which is on line 817 of frontendstyle.css)

    Thanks,

    Thread Starter kaizerco

    (@kaizerco)

    I forgot to mention I’m using firefox.

    It seems that in firefox ‘max-content’ is giving an error: “invalid property value”, and that’s why lines 530 and 110 are affecting the input div.

    In chrome it seems to be fine.

    Apparently max-content in firefox = -moz-max-content
    That works!

    • This reply was modified 6 years, 5 months ago by kaizerco.
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Offscreen element causing horizontal scrollbar’ is closed to new replies.