New Topic/Question
Reply
I'm having a bit of bother with a little live search I have made. It all works great but the positioning of it is all wrong. I've made a small example to show exactly what I mean....
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
.popup {
position: relative;
width: 150px;
height: 1px;
}
#layer2 {
width: 150px;
text-align: left;
}
.addition {
position:absolute; /*upwards rather than down.*/
bottom: 100%;
}
body {
padding-top: 200px;
}
</style>
</head>
<body style="width:1100px; margin:0 auto;">
<div>
<table width="1100" border="1" cellspacing="0" cellpadding="0">
<tr>
<td valign="middle">
<ul class="popup" id="popup" name="popup">
<div id="layer2" class="blue, addition"></div>
<input name="search1" type="text" class="textboxes"style="width:150px; font-size:10px" id="search1" value="Search Recipes....." title="Press enter to search."/>
</ul></td>
<td valign="middle"><label for="ingrtype"> Type of Ingredient:
<select name="type" class="textboxes" id="type">
<option value="">Ingredient Type</option>
</select>
</label>
</td>
<td valign="middle"><label for="ingredients2">Ingredient:
<select name="ingredients" class="textboxes" id="ingredients">
<option value="">Ingredient</option>
</select>
</label></td>
<td valign="middle"><label for="qty2">Qty:
<input name="qty" type="text" class="textboxes" id="qty" />
<input name="Submit1" type="button" class="buttons" id="Submit1" value="Add"/>
</label></td>
</tr>
</table>
</div>
</body>
</html>
As you can see, the searchbox/popup is way off centre. Is there an easy (obvious) way to sort this? Everything I have tried has meant I would need to use absolute positioning which will be a pain with different resolutions etc.
Thanks
MultiQuote
| 