This is how I fixed the layout issue:
}]]>
class="searchcontainer">
"margin-left:auto; width:100%">
class="searchcontainerinner">
"#{sessionScope.searchQuery}"
autocomplete="off" id="inputText1" styleClass="searchbox">
"onkeyup" submit="true"
refreshMode="partial" refreshId="dataView1">
And then added the following CSS:
.searchcontainer {
color: rgb(255, 0, 0);
background: -webkit-gradient(linear, left top, left bottom, from(rgb(225, 226, 230)), to(rgb(151, 167, 188) ) );
height: 32px;
vertical-align: middle;
line-height: 41px;
}
.searchcontainerinner {
height: 26px;
font-size: 20px;
padding: 4px 13px 0px 5px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
background: #ffffff;
color: rgb(16, 92, 182);
font-weight: bold;
width: 85%;
margin-left: auto;
margin-right: auto;
margin-top: 2px;
}
.searchbox {
width: 100% !important;
border:none;
position: relative;
top: -10px;
}
Hope this helps.
Matt