Skip to main content
devinbotkins
devinbotkins
Known Participant
Jun 29, 2022 12:47 AM UTC
Question

Header Footer with same properties not displaying accurately between two pages

Building a new website and I’m using two css stylesheets which is consistent with my home page. One stylesheet is for the Header/Footer and the other is for its contents. The navigation and footer sections are separated so that I don’t need to repeat my work over on every page. I'm working on the second page of its design. Programming is the same between the two pages except its navigation is not displayed properly on the second page. My logo is sitting in the wrong place and the navigation bar is not spaced properly from left to right. I have written all container code in unique form so that there is no overlapping properties. Navigation should display properly on all of its pages. Any idea why or whats wrong with this section?

Devin

    This topic is closed to new replies. Start a new post to keep the conversation going.

    3 replies

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    Jun 29, 2022 6:35 PM UTC

    I see no need for TWO stylesheets.  That's probably causing more harm than help at this point.

     

    For consistency across small, medium or large sites, it's best to have one stylesheet which defines all sitewide elements  -- header, navigation, body, footer, etc...

     

    On those rare occasions when you need them, embeded styles inside the <head> tags are for page specific styles.

    https://www.w3schools.com/css/css_howto.asp

     

     

    Translate
    Nancy O'Shea— Product User & Community Expert
      Community Expert
      Ben MCommunity Expert
      Community Expert
      Jun 29, 2022 11:44 AM UTC

      Best thing you can do is share the code. Short of that you can right click on an element, like your image, and choose inspect element.  In the CSS inspector of your browser you can see what CSS attributes are impacting your design and see where the differences are to resolve your issue.

      Translate
      BenPleysier
      Community Expert
      BenPleysierCommunity Expert
      Community Expert
      Jun 29, 2022 1:11 AM UTC

      Please post the code here so that we can see what you are seeing.

      Translate
      Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!
      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices