locked
Footer is showing half on mobile version of website RRS feed

  • Question

  • User1601878731 posted

    I am creating a mobile version of website.

    Footer is showing half on page.

    I m trying with CSS/media queries,but didn't change.

    Anyone knows how to fix it?

    Thanks in advance.

    Tuesday, June 14, 2016 12:09 PM

Answers

  • User-1672470423 posted

    Add this to your css file at last

    @media only screen and (max-width: 768px) {
    .page-footer
    {
        ;
        border-width: thin;
        border-style: solid;
        opacity: 0.9;
        margin: 0.3em;
        min-height: 16em;
        width: 285%;
    }
    }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 15, 2016 1:43 PM

All replies

  • User-821857111 posted

    You should show the CSS you are applying to your footer.

    Tuesday, June 14, 2016 12:25 PM
  • User1601878731 posted

    footer {
    position : relative;
    bottom: 0;
    width: 100%;
    clear: both;
    }

    Tuesday, June 14, 2016 12:38 PM
  • User1601878731 posted

    I m creating mobile version of website in mvc 5.

    Tuesday, June 14, 2016 12:42 PM
  • User-1672470423 posted

    Is it available online. If yes share the Url.

    Try this,

    footer {
      ;
      right: 0;
      bottom: 0;
      left: 0;
      padding: 1rem;
      background-color: #efefef;
      text-align: center;
    }

    Tuesday, June 14, 2016 3:42 PM
  • User1601878731 posted

    Yes it is www.wing.network

    On mobile view,only the footer is not showing full width.

    It is showing half.

    Wednesday, June 15, 2016 5:59 AM
  • User-1672470423 posted

    Add this to your css file at last

    @media only screen and (max-width: 768px) {
    .page-footer
    {
        ;
        border-width: thin;
        border-style: solid;
        opacity: 0.9;
        margin: 0.3em;
        min-height: 16em;
        width: 285%;
    }
    }

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 15, 2016 1:43 PM
  • User1601878731 posted

    I m trying for 

    @media only screen and (max-width: 768px) {
    footer
    {

    }

    That's why failed.

    Thank you very much,it is useful for me.

    Thursday, June 16, 2016 4:55 AM