首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >CSS供应商用于HTML表单的前缀

CSS供应商用于HTML表单的前缀
EN

Stack Overflow用户
提问于 2015-02-26 13:55:59
回答 1查看 430关注 0票数 0

我正在为5种主要浏览器开发一个表单,并希望了解更多关于CSS供应商前缀的信息。这个表单在firefox中看起来不一样,我通常会用顶部和左边的CSS移动div,但只想调整firefox。从我所读到的-moz-利润率-开始:10‘t;似乎是移动div的一种方式,但不起作用。如何使用css在firefox中移动div?

我这里有一个前缀列表-- http://peter.sh/experiments/vendor-prefixed-css-property-overview/https://developer.mozilla.org/en-US/docs/Web/CSS/-moz-margin-start

附注:我读到,使用Grunt停止了使用CSS前缀的需要,值得设置吗?

代码语言:javascript
复制
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>title</title>

    <link rel="stylesheet" type="text/css" href="blueprint/blueprint/screen.css" />
    <link rel="stylesheet" type="text/css" href="blueprint/blueprint/src/typography.css" />
    <link rel="stylesheet" type="text/css" href="style.css" />
    <!--<link rel="stylesheet" type="text/css" href="blueprint/blueprint/ie.css" />-->
    <!--[if IE]>
    <link rel="stylesheet" href="blueprint/ie.css" type="text/css"
    media="screen, projection">
    <![endif]-->

</head>

<body>
    <div class="container showgrid">
                <h2><center>Research Request Form</center></h2>



                <div> 
                    <input type="text" class="span-4" id="listcode">

                </div>
                <div>
                    <input type="text" class="span-4" id="sourceCode">

                </div>
                <div>
                    <input type="text" class="span-7" id="division">

                </div>
                <div class="span-24" id="wrap2">

                    <input type="text" class="span-23" id="projectName">

                </div>
                <div class="span-4">
                    <div class="span-4" id="interestCodes">
                        <p>
                            <input class="span-4" id="interestCodes" style="" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes" style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes"style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes"style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                        </p>
                        <p>
                            <input class="span-4" id="interestCodes"style="margin-top:-7.5px;" type="text" name="mm" size="16" value="" />
                            <p style="">&nbsp;Interest Codes</p>
                        </p>
                </div>
                <div>
                        <input class="span-18" id="listCodeAndName"style="" name="Text1" value="List code and Name:">
                </div>
                <div id="detailWrap">
                    <div id="details"> 
                    <p>Marketing Manager:  </p> 
                    <p>Marketing Director: </p> 
                    <p>Date Submitted:  </p> 
                    <p>Ideal Deadline: </p> 
                    <p>Quantity Submitted: </p> 
                  <p><input type="submit" name="submit" value="Send" /></p>                                                                 

                </div>

    </div>
</body>
</html>

body {
    background-color: #99FF99;
    font-family: verdana, sans-serif;
}
#listcode {
    height: 50px;
    margin-left: 22px;
}
.container {
    border:2px solid black;

}
#sourceCode {
    height: 50px;
    margin-left: 58px;
}
#division {
    height: 50px;
    float: right;
    margin-right:18px;
}
#wrap2 {

    display: block; 
    clear: both;

}
#projectName {
    height: 50px;
    margin: 20px 20px 20px 20px;

}
#interestCodes {
    margin-left: 10px;
}
#listCodeAndName{
    -moz-margin-end:10em;
    margin-left: 230px; 
    width: 688px;
    height: 160px;
    position: fixed;
    top: 224px;
    left: 146px;

}
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-02-26 14:08:43

如果我正确地解决了你的问题,那么你的div容器就不在左上角。这是因为浏览器有其默认的css定义,比如body元素上的10 on边距。您可以轻松地解决这个问题:

代码语言:javascript
复制
body {
    margin: 0;
}

或者你最好开始使用CSS重置,例如normalize.css

我希望这能帮上忙,而且我没有走错路。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/28744321

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档