我如何将这两个下拉菜单放在一起?

时间:2014-07-26 02:49:28

标签: html web

在我的网站上Website我似乎无法将这些下拉菜单放在一起,我该怎么做?

这是我的代码......

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>$MODULE_NAME$ - $SITE_NAME$</title>
<?$META_DESCRIPTION$?>

<link type="text/css" rel="StyleSheet" href="/_st/my.css" />
</head>
<body>
$ADMIN_BAR$
$GLOBAL_AHEADER$
<!-- <middle> -->
<div id="maincol">
$MODULE_SEARCH_FORM$
<!-- <body> --><table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="80%"><a href="$HOME_PAGE_LINK$"><!--<s5176>-->MAIN<!--</s>--></a> &raquo;     <!--<s5208>-->MOVIES<!--</s>--></td>
<td align="right" style="white-space: nowrap;"><?if($ADD_ENTRY_LINK$)?>[ <a href="$ADD_ENTRY_LINK$"><!--<s5202>-->Add new entry<!--</s>--></a> ]<?endif?></td>
</tr>
</table>
<hr />
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<div>
<form name="yearselect">FILTER BY:
<select name="menu" onChange="window.document.location.href=this.options[this.selectedIndex].value;" value="GO">
<option selected="selected">YEAR</option>
<option value="year/1">2014</option>
<option value="year/2">2013</option>
</select>
</form>
</div><div>
<form name="genreselect">
<select name="menu" onChange="window.document.location.href=this.options[this.selectedIndex].value;" value="GO">
<option selected="selected">GENRE</option>
<option value="URL">Action</option>
<option value="URL">Horror</option>
</select>
</form>
</div>
<td align="right"><?if($PAGE_SELECTOR$)?><!--<s3015>-->Pages<!--</s>-->:         $PAGE_SELECTOR$<?endif?></td>
</tr>
</table>
<hr />
$BODY$
<?if($PAGE_SELECTOR1$)?><div style="text-align:center;">$PAGE_SELECTOR1$</div><?endif?>        <!-- </body> -->
</div>
<div id="sidebar">
<div id="soc">
<?if($RSS_LINK$)?><a href="$RSS_LINK$" target="_blank" title="RSS" class="soc-rss"></a>        <?endif?>
<a href="http://del.icio.us/post?url=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Del.icio.us" class="soc-del"></a>
<a href="http://www.facebook.com/share.php?u=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="FaceBook" class="soc-facebook"></a>
<a href="http://memori.ru/link/?sm=1&u_data[url]=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Memori" class="soc-memori"></a>
<a href="http://vkontakte.ru/share.php?url=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Vkontakte" class="soc-vkontakte"></a>
<a href="http://twitter.com/share?url=$HOME_PAGE_LINK$" rel="nofollow" target="_blank" title="Twitter" class="soc-twitter"></a>
</div>
$GLOBAL_CLEFTER$
</div>
<div class="clear"></div>
<!-- </middle> -->
</div>
</div>
$GLOBAL_BFOOTER$
</div>
</div>
</div>
</body>
</html>

这是代码的完整来源,但是,我只需要部分帮助..

3 个答案:

答案 0 :(得分:1)

这是针对您的问题的有效HTML5解决方案fiddle

<form>
  <table>
    <tr>
      <td>FILTER BY:
        <select name="yearselect">
          <option selected="selected">YEAR</option>
          <option value="year/1">2014</option>
          <option value="year/2">2013</option>
        </select>
      </td>
      <td> 
        <select name="genreselect">
          <option selected="selected">GENRE</option>
          <option value="URL">Action</option>
          <option value="URL">Horror</option>
        </select>
      </td>
    </tr>
  </table>
</form>

答案 1 :(得分:0)

避免吃饭!!请参阅此fiddle

标记:

<div>
    <form name="yearselect">FILTER BY:
        <select name="menu" onChange="window.document.location.href=this.options[this.selectedIndex].value;" value="GO">
            <option selected="selected">YEAR</option>
            <option value="year/1">2014</option>
            <option value="year/2">2013</option>
        </select>
    </form>
</div><div>
    <form name="genreselect">
        <select name="menu" onChange="window.document.location.href=this.options[this.selectedIndex].value;" value="GO">
            <option selected="selected">GENRE</option>
            <option value="URL">Action</option>
            <option value="URL">Horror</option>
        </select>
    </form>
</div>

CSS:

div {
    display: inline-block;
    width: 50%;
}

答案 2 :(得分:0)

所以你让桌子一直延伸到整个div,每个下拉都在每一列的中心。你需要在表格的div上设置一个最大宽度,这样它只会扩展一定的宽度,然后下拉不会进一步扩散。或者,您可以将它们放在同一列中(因此基本上没有表格)并将它们放在一边。