Title: Header Border
Last modified: March 10, 2022

---

# Header Border

 *  Resolved [bob reeves](https://wordpress.org/support/users/bob-reeves/)
 * (@bob-reeves)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/)
 * Hi, I am trying out full site editing.
 * I have an existing website which I am trying to re-create.
 * On the Header I have a border only at the bottom of the header, within the editor
   it is only possible to create a full border.
 * Could you please explain to me how to achieve this with css.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fheader-border-5%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 10 replies - 1 through 10 (of 10 total)

 *  [saturn3](https://wordpress.org/support/users/saturn3/)
 * (@saturn3)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446119)
 * Attach a class to the block. And then you can use CSS to style it. Do you know
   how to do those two things? If not, can explain.
 * The tools you expected to find are just not there in this theme. Some of the 
   control we want on blocks is prevented by this new way of doing things, and there
   are also features that are disabled for end users by the theme maker. Hard to
   say which one prevents things from happening so far for me.
 * Anyway, for now, classes and CSS are the option. You could also probably work
   it out through the JSON file and customizing that. But make it easy and go with
   CSS through a plug in or a child theme.
    -  This reply was modified 4 years, 3 months ago by [saturn3](https://wordpress.org/support/users/saturn3/).
 *  Thread Starter [bob reeves](https://wordpress.org/support/users/bob-reeves/)
 * (@bob-reeves)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446136)
 * Hi [@saturn3](https://wordpress.org/support/users/saturn3/),
 * thankyou for getting back to me so quickly.
 * Could you please explain how to add the class and css style, as I have tried 
   with no success.
 * Regards
 * Bob
 *  [saturn3](https://wordpress.org/support/users/saturn3/)
 * (@saturn3)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446137)
 * You could also maybe create an empty area under what is now your header block
   list with maybe a group or section block that has a background color and a height.
   Maybe. But that is not what you asked for.
 *  Thread Starter [bob reeves](https://wordpress.org/support/users/bob-reeves/)
 * (@bob-reeves)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446146)
 * Thanks for your response once again, however as I wish to have a sticky header
   I do not think that this would work.
 *  [saturn3](https://wordpress.org/support/users/saturn3/)
 * (@saturn3)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446166)
 * This is an awesome reference below. If it’s too much, I will be back later on
   to assist. Right now, there is no easy way to add custom CSS to Twenty Teeny 
   Two, so go with a plugin. I use Site Origin CSS. Always back up your CSS code
   somewhere outside the plugin!
 * This will show you how to add a class to a block. Then control it with the CSS.
   You will not see the results in a page or template editor until you preview or
   serve the page to an end user.
 * [https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/](https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/)
 * When it gets to:
    Then, we can add this CSS to our site under Customize → Additional
   CSS
 * That is not something you can do right now. That is when you switch to the Site
   Origin plug in to insert your CSS.
 *  [saturn3](https://wordpress.org/support/users/saturn3/)
 * (@saturn3)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446196)
 * I have a sticky header through CSS. I googled for code and played around with
   it to make it work.
 *  Thread Starter [bob reeves](https://wordpress.org/support/users/bob-reeves/)
 * (@bob-reeves)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446280)
 * Thanks [@saturn3](https://wordpress.org/support/users/saturn3/),
 * the link for css classes worked perfectly for me.
 * If you could let me have the css for sticky header I would much appreciate it.
 * Regards
 * Bob
 *  [saturn3](https://wordpress.org/support/users/saturn3/)
 * (@saturn3)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446507)
 *     ```
       header {
           position: sticky;
           top: 0;
           z-index: 99999997;
       }
       ```
   
 * I am using a high Z-index to prevent things in the body from scrolling over my
   header.
 * Try it without if you wish!
 *  Thread Starter [bob reeves](https://wordpress.org/support/users/bob-reeves/)
 * (@bob-reeves)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15446574)
 * Once again thankyou [@saturn3](https://wordpress.org/support/users/saturn3/),
   
   I will give it a try later.
 * Regards
    Bob
 *  [Ram Freedman](https://wordpress.org/support/users/ramf/)
 * (@ramf)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15449890)
 * Hi [@saturn3](https://wordpress.org/support/users/saturn3/)
    I used your code
   for the sticky header and it’s working superb! Thanks you for that! Ram

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘Header Border’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/twentytwentytwo/2.1/screenshot.
   png)
 * Twenty Twenty-Two
 * [Support Threads](https://wordpress.org/support/theme/twentytwentytwo/)
 * [Active Topics](https://wordpress.org/support/theme/twentytwentytwo/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/twentytwentytwo/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/twentytwentytwo/reviews/)

 * 10 replies
 * 3 participants
 * Last reply from: [Ram Freedman](https://wordpress.org/support/users/ramf/)
 * Last activity: [4 years, 3 months ago](https://wordpress.org/support/topic/header-border-5/#post-15449890)
 * Status: resolved