Skip to main content
Participant
March 24, 2024
Answered

footer not displaying correctly

hi there,

Trying to get the footer to display across the entire VW like the header and can't figure out why it won't.

 

https://peetahh.github.io/portfolio/

 

tried to get an answer out of chat gpt - totally useless.

hoping that some  Acutual Intelegence can help me 🙂

    This topic is closed to new replies. Start a new post to keep the conversation going.
    osgood_Correct answer
    Legend
    March 24, 2024

    OK this is a simple fix. Your <footer></footer> tag  is within the <main></main> tag and that is set to max-width: 800px; so your footer isnt ever going to be wider than 800px.

     

    Solution: Move the <footer></footer> tag to AFTER the closing </main> tag and BEFORE the closing </body> tag like:

     

    </main>

    <!-- Footer -->
    <footer>
    <p>My feeble attempt to learn coding</p>
    </footer>

    </body>
    </html>

     

    As an aside note the <footer> should not have initially been within the <main> tag as that is for the main content of the website. The <footer> as its name would suggest and in keeping with your construction should be at the end of the html structure, so in moving the <footer> you have a much better html structure.

     

    Of course you can have as many footers as you like for different sections of your website BUT in your case its a very simple structure so there is no dispute as to where it should be in the html code. 

     

     

    3 replies

    osgood_Correct answer
    Legend
    March 24, 2024

    OK this is a simple fix. Your <footer></footer> tag  is within the <main></main> tag and that is set to max-width: 800px; so your footer isnt ever going to be wider than 800px.

     

    Solution: Move the <footer></footer> tag to AFTER the closing </main> tag and BEFORE the closing </body> tag like:

     

    </main>

    <!-- Footer -->
    <footer>
    <p>My feeble attempt to learn coding</p>
    </footer>

    </body>
    </html>

     

    As an aside note the <footer> should not have initially been within the <main> tag as that is for the main content of the website. The <footer> as its name would suggest and in keeping with your construction should be at the end of the html structure, so in moving the <footer> you have a much better html structure.

     

    Of course you can have as many footers as you like for different sections of your website BUT in your case its a very simple structure so there is no dispute as to where it should be in the html code. 

     

     

    Translate
    Participant
    March 24, 2024

    thanks so much!

    I figured it had to be something very basic that I was overlooking

    I appreciate you taking the time to look at this.

    Translate
    Legend
    March 24, 2024
    quote

     

    I appreciate you taking the time to look at this.


    By @peterb78017136

     

     

     No problem, post again if you encounter more issues........good luck with your coding journey.

    Translate