Thank you, Andrew! I'll definitely try this out.
Another area of concern is with the right-side form elements. They are
not aligning properly and nothing I've tried has worked.
Any advice in solving this issue as well would be appreciated.
Jeremy
On Wed, Apr 30, 2008 at 12:05 PM, Andrew Doades <[EMAIL PROTECTED]> wrote:
> Not being a big knowledge man of css but I would have thought you would
> need, <ul> and <li> in there?
> <ul>
> <li><a href="index.php">Home</a></li>
> <li>a href="complete.php">Browse All Titles</a></li>
> </ul>
>
> and in your css have something like
> #nav ul {
> margin-left: 2em;
> padding-left: 0;
> color: #000000;
> }
>
> Andrew
>
> [EMAIL PROTECTED] wrote:
> >
> >
> >
> > I'm new to CSS. But I need to position four form elements in a very
> > thin nav bar. Here is my HTML code:
> >
> > <div id="nav">
> > <div id="nav_left">
> > <a href="index.php">Home</a> |<a href="complete.php">
> > Browse All Titles</a> | <a href="author.php">About Author</a></div>
> > <div id="bookmark"><table width="307" border="0"
> > cellspacing="0" cellpadding="0">
> > <tr>
> > <td width="64" valign="middle">Browse by</td>
> > <td width="113" valign="middle"><form action="" method="get">
> > Title
> > <select name="var" size="1">
> >
> > <option value="A">A</option>
> >
> > <option value="B">B</option>
> >
> > <option value="C">C</option>
> >
> > <option value="E">E</option>
> >
> > <option value="F">F</option>
> >
> > <option value="G">G</option>
> >
> > <option value="H">H</option>
> >
> > <option value="I">I</option>
> >
> > <option value="J">J</option>
> >
> > <option value="K">K</option>
> >
> > <option value="L">L</option>
> >
> > <option value="M">M</option>
> >
> > <option value="N">N</option>
> >
> > <option value="O">O</option>
> >
> > <option value="P">P</option>
> >
> > <option value="Q">Q</option>
> >
> > <option value="R">R</option>
> >
> > <option value="S">S</option>
> >
> > <option value="T">T</option>
> >
> > <option value="U">U</option>
> >
> > <option value="V">V</option>
> >
> > <option value="W">W</option>
> >
> > <option value="X">X</option>
> >
> > <option value="Y">Y</option>
> >
> > <option value="Z">Z</option>
> >
> > <option value="1">1</option>
> >
> > <option value="2">2</option>
> >
> > <option value="3">3</option>
> >
> > <option value="4">4</option>
> >
> > <option value="5">5</option>
> >
> > <option value="6">6</option>
> >
> > <option value="7">7</option>
> >
> > <option value="8">8</option>
> >
> > <option value="9">9</option>
> >
> > <option value="0">0</option>
> >
> > </select><input type="image" class="inputbutton"
> > src="img/input.jpg" alt="" width="15" height="15">
> > </form></td><td width="123" valign="middle"><form action=""
> > method="get">Decade <select name="var" size="1">
> >
> > <option value="1950">1950s</option>
> >
> > <option value="1960">1960s</option>
> >
> > <option value="1970">1970s</option>
> >
> > <option value="1980">1980s</option>
> >
> > <option value="1990">1990s</option>
> >
> > <option value="2000">2000s</option>
> > </select><input type="image" class="inputbutton"
> > src="img/input.jpg" alt="" width="15" height="15">
> > </form></td>
> > </tr>
> > </table>
> >
> > </div>
> > </div>
> >
> >
> > And here are the applicable styles:
> >
> >
> > #nav {
> > background-image: url(../img/navback.jpg);
> > background-repeat: no-repeat;
> > background-position: left top;
> > border: thin solid #7a8251;
> > height: 25px;
> > width: 771px;
> > }
> > #nav_left {
> > width: 400px;
> > float: left;
> > text-align: left;
> > padding-top: 5px;
> > padding-right: 5px;
> > padding-bottom: 7px;
> > padding-left: 5px;
> > }
> > #bookmark {
> > width: 300px;
> > float: right;
> > text-align: right;
> > display: inline;
> > padding-top: 5px;
> > padding-right: 3px;
> > padding-bottom: 5px;
> > }
> > .inputbutton {
> > margin-right: 3px;
> > margin-left: 3px;
> > }
> > select {
> > display: inline-table;
> > font-size: 75%;
> > padding: 0px;
> > }
> >
> >
> > But, the form elements are sitting low and not aligning as needed. The
> > input buttons are sitting too high.
> >
> > There is a screenshot at http://www.graiai.com/snap.jpg
> >
> > This is taken in Firefox on a Mac. On IE 7, the dropdowns sit even lower.
> >
> > I don't know what to do! Any ideas?
> >
> > Jeremy
> > ______________________________________________________________________
> > css-discuss [EMAIL PROTECTED]
> > http://www.css-discuss.org/mailman/listinfo/css-d
> > List wiki/FAQ -- http://css-discuss.incutio.com/
> > List policies -- http://css-discuss.org/policies.html
> > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
> >
> >
> >
>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
