Centering text in banner heading.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Google Chrome has a great ‘Inspect element’ feature, an option shown when right clicked.

    You can right click on the text in the header, or anywhere you want, then Inspect element and from here you can add your CSS styling.
    https://developers.google.com/chrome-developer-tools/docs/elements

    You want to be using CSS style of text-align: center;
    https://www.w3schools.com/cssref/pr_text_text-align.asp

    Thread Starter Terry

    (@tjhoyt)

    Okay. I will do that.

    Thanks again.

    Thread Starter Terry

    (@tjhoyt)

    Do you know why GOOGLE CHROME is so slow? It seems to cause my laptop to freeze up for seconds at a time, stall. I don’t use it for that reason – only for stuff like you suggested.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    You can use Firefox Firebug add-on.

    Thread Starter Terry

    (@tjhoyt)

    Okay – when you say this above:

    from here you can add your CSS styling.

    Where is “here”? Do you mean in the Custom CSS Manager? Last time I just copied and pasted the code you gave and put it into the manager. What about this case? I’m not sure what I”m looking for in the Chrome Element inspector.

    Thank you.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    The context of “here” was within the “Inspect element” option, whereby allowing you to make temporal appearance changes, in which you could progress to the Custom CSS Manager.

    Thread Starter Terry

    (@tjhoyt)

    This is the code I see for that element. But I see nowwhere to change the alignment of this text. The alignment it DOES give is for text on the site, not this heading text.

    <html lang=”en-US” dir=”ltr”>
    <head>
    <body class=”home page page-id-4 page-template-default logged-in admin-bar custom-background three-column content-sidebar-sidebar customize-support”>
    </html>

    Added the Firebug. Great. THanks.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    In your Custom CSS Manager area, add;

    #site-title {
 text-align: center;
}

    Thread Starter Terry

    (@tjhoyt)

    Thanks. That worked. How did you know to put “site title”? I didn’t put any data in the last post as far as I can see?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I was using Chrome’s Inspect element option and tracked down what was causing the text to align right.
    There was some style saying

    #site-title {
 text-align: right;
}

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Centering text in banner heading.’ is closed to new replies.