page title border

  • Unknown's avatar
    mkhanna5 · Member ·

    Hi,
    I would like to add a border to the page titles THE APPROACH and SIGN UP! https://mathsexperiment.com/the-approach/ and https://mathsexperiment.com/sign-up-2/. I would like these to be in the same format as the panel headings on the home page (there is a squarish border around each heading). Can someone help me with the code please? Thank you!

    The blog I need help with is: (visible only to logged in users)

  • kathrynwp · Staff ·

    Give this a try to add the border to the title of just those two specific pages:

    .page-id-203 h1.entry-title, .page-id-215 h1.entry-title {
     border-style: solid solid none;
     border-width: 2px 2px 0px;
     display: inline-block;
     max-width: 100%;
     position: relative;
}

.page-id-203 h1.entry-title, .page-id-215 h1.entry-title {
     padding: 0.75rem 1.5rem 0.85rem;
}

.page-id-203 h1.entry-title::before, .page-id-215 h1.entry-title::after {
     border-bottom: 2px solid #000000;
     bottom: 0px;
     content: "";
     display: block;
     position: absolute;
     width: 50px;
}

.page-id-203 h1.entry-title::before, .page-id-215 h1.entry-title::before {
     left: 0px;
}

.page-id-203 h1.entry-title::after, .page-id-215 h1.entry-title::after {
     right: 0px;
}
.page-id-203 .entry-header, .page-id-215 .entry-header {
     text-align: center;
}

    If you want the same formatting applied to additional specific new page titles in the future, follow the example above, adding new elements separated by a comma for each code block.

    If you want the formatting applied to all page titles now and in the future — except on the homepage, where it’s already applied — we can create a slightly different code. Let me know what you had in mind.

  • The topic ‘page title border’ is closed to new replies.