I spent some time looking for a solution for this issue but I've had no luck. I am trying to use flex boxes to create a site header, but can't quite get it to look right. Right now, the header I want to use is all clumped up on the left, and I would like the title of the website on the left side and the menu on the right. I used the CSS validator and it came up green...
Here are the relevant sections of code:
<style> .site-header { display: flex; flex-direction: row; justify-content: space-between; width: 100%; /* or a suitable width */ } .info-menus { color: rgb(0,0,0); font-family: Newsreader; font-weight: bold; line-height: 0.4em; text-decoration: None; margin: 5px; } .site-footer { position: fixed; left: 0; bottom: 0; width: 100%; background-color: rgb(0, 0, 0); color: white; text-align: center; font-family: Newsreader; font-weight: bold; }</style><header><div class=".site-header"><a href="/" class= ".item" style="rgb(0,0,0); font-family: Instrument Serif; font-weight: bold; line-height: 2.0em; color: inherit; text-decoration:none">MyWebsite</a><a href="/contact" class="info-menus">Contact</a><a href="/about" class="info-menus">About</a></div></header>Thanks for looking!