0

全部-

谷歌搜索并尝试了大约 20 分钟,但似乎无法弄清楚这一点。有谁知道为什么我不能得到 Search: 在同一行?

我试过显示:内联,显示:块,浮动:左/右,清除:两者,但无济于事。即使使用 chrome 检查器,我也无法弄清楚它为什么不能正常工作。

编辑:粘贴相关代码

<li>Search: <input type="text" name="quest_search"></li>

对应的css:

header {
    background: #f6f6f6;
    height: 58px;
    border-bottom: 1px solid #eaeaea;
    margin-bottom: 60px;
}
    /* Social Links */
    header aside ul {
        padding-top: 18px;
    }
    /* Main Navigation */
    header .select-menu { display: none; }
    header nav { position: relative; }
    header nav ul {
        list-style: none;
        float: right;
        padding: 22px 0px 0px 0px;
    }
        header nav ul li {
            float: left;
            margin-left: 30px;
            position: relative;
        }       
            header nav ul li a{
                color: #b5b5b5;
                font-size: 12px;
                -webkit-transition:color 0.2s ease-in;  
            -moz-transition:color 0.2s ease-in;  
            -o-transition:color 0.2s ease-in;  
            transition:color 0.2s ease-in;
            }
            header nav ul li a:hover { color: #777; }
            header nav ul li.current a{ color: #555; font-weight: bold; }
            header nav span.arrow {
                width: 24px;
                height: 13px;
                background: url('../images/light-nav_arrow.png') no-repeat;
                display: none;
                position: absolute;
                top: 58px;
            }

http://dump.tanaris4.com/so/cfs.html

提前致谢!

4

4 回答 4

3

Your issue is that the input in base.css has a a width of 100%. This means that the width of the input will always be 100% of the size of its parent element, which also contains the "search: " text. Change this to something less than 100% and it should work fine.

For example:

input[type="password"], input[type="text"], input[type="email"] {
    width: 50%;
}

Of course, width:50% is just one example of what you can use. width:auto and other specific widths will work. Just play around with it and see what works best for you.

于 2013-02-07T20:50:51.487 回答
2

Your base.css file is giving the input a width: 100%;. Try giving it a width: auto

于 2013-02-07T20:50:59.073 回答
1

CSS:

input[name="quest_search"]{
    width: auto;
}
于 2013-02-07T20:51:08.940 回答
0

Just put "Search:" in it's own <li> is a simple quick fix.

于 2013-02-07T20:50:58.803 回答