Skip to main content
Inspiring
July 6, 2025
Question

Inexplicable lines on page

  • July 6, 2025
  • 3 replies
  • 324 views

Hello,

I am working on updating a site using a template. Everything has come along well except that there are some unwanted horizontal lines appearing on top of the graphic and the page areas. I've gone all through the code and cannot figure out how to get rid of them. Can anyone help?rideskat.org/index4.html 

    3 replies

    Nancy OShea
    Community Expert
    Community Expert
    July 8, 2025

    FYI, blue text on a green background is a very bad combination for visually challenged people.  

     

    A public transit website has to conform to WCAG. A scan of that page found 19 accessibility violations that could pose potential legal issues ahead.

    https://www.audioeye.com/lp/wcag-web-compliance/

     

    Nancy O'Shea— Product User & Community Expert
    Jon Fritz
    Community Expert
    Community Expert
    July 7, 2025

    You have border settings on multiple h2 selectors that affect those elements.

    You may have only wanted the borders on specific <h2> tags, but your selectors that Ben points out, are general enough to cause the lines to also be added to the empty h2 tags in that affected area.

    For what it's worth, it doesn't make sense to use <h2> in this context. <h2> tags are semantic tags that tell search engine crawlers what the second most important heading on your page is. They should always have important html text between them. There are a ton of ways to go about creating space that won't confuse search engines and screen readers (margin or padding settings make more sense here).

    Here's some more info: https://www.w3schools.com/html/html_headings.asp 

    Kevin E.Author
    Inspiring
    July 7, 2025

    This is a template that I downloadedthat I'm working from.

     

    i've sought out every H2 tag in the CSS and the HTML and changed the value to zero. The lines are still there. Can you tell me specifically what line needs to be changed?

    Jon Fritz
    Community Expert
    Community Expert
    July 7, 2025

    There are a few places.

    1. The border on line 1795 in the main.css file
    2. The border-top on line 1812 in the main.css file
    3. The border-bottom on line 1821 in the main.css file

    Commenting out those three settings out removes the lines from your image, but that may also remove them from places you actually want them.


    BenPleysier
    Community Expert
    Community Expert
    July 7, 2025

    Use the developer tools in your browser and all will be revealed as in

    Or better still, used Wappler so that you can be independent of a browser:

     

     

    Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!