My goal is to center the title in the middle of the page, taking into account its alignment with the search bar. However, I want it to be centered independently and not affected by the search bar's position. Is there a way to achieve this?
To better explain, in this JSFiddle example, the navigation menu is centered, and I want the title to be positioned directly above it. Any help would be appreciated. Thanks -Kyle
If the JSFiddle link stops working, here is the code snippet of the problematic area:
#head {
margin: 2% auto 2% auto;
text-align: center;
}
#head h1 {
display: inline;
}
<div id="head">
<h1> Title </h1>
<form action="test.asp" style="float:right; margin-right: 3%;">
<input type="text">
</form>
</div>