I’m having real problems and getting confused trying to style and locate the input field and the submit button for AjaxSearch - I hope someone can help me please.
I’m using modx-1.0.2 on php-4.4.8-1 and this is an example page to show my problem;
http://pulse-test.co.uk.s59294.gridserver.com/about/pulse-connect.html
Basically I want the input and submit to line up on one line, in line with the menu created.
Here is the HTML from the header to the content section with the snippet call;
<div id="container">
{{header}}
<div id="navigation-container">
{{navigationmenuabout}}
<div id="search">[!AjaxSearch? &ajaxSearch=`0` &AS_showResults=`0` &AS_landing=`57`!]</div>
</div>
<div id="wideHead">
<h1>[*longtitle*]</h1>
<!-- end #wideHead -->
</div>
<div id="column1">
[*#content*]
The navigation-container holds both the menu system and the search elements in two child layers - the ’navigationmenuabout’ chunk holds all the menu info and you can see the ’search’ div. Removing the snippet call and putting in a blank field with input and submit, everything is fine and lines up.
So I’ve been looking for hours at CSS to style the Ajaxsearch elements with little success. Here is the CSS
#search {float: right;
width: 150px;
height: 30px;
}
#ajaxSearch_form {
width: 100px;
height: 30px;
}
fieldset {
border: none;
padding: none;
margin: none;
}
#ajaxSearch_input {
width: 50px;
/* display: inline;
height: 17px;
margin: 0 3px 0 0;
padding: 3px 0 0;
vertical-align: top; */
}
#ajaxSearch_submit {
background-color: #000080;
color: #d0d0ff;
font-weight: bold;
display: inline;
height: 22px;
line-height: 22px;
margin: 4px 0 0 0;
}
Can anyone help please it’s driving me crazy and I need to get it fixed. Thanks, David
