English 中文(简体)
CSS: Chrome的 but子体大小不一
原标题:CSS: Size of buttons in Chrome is different than Firefox

我有以下超文本:

<style type="text/css">
.submitbutton{margin-left:-2px;padding:1px}
</style>
...
<form> 
... 
<input class=submitbutton type=submit value="Create Listings" /> 
</form>

在欧罗纳,投入比 Chrome大。

任何想法为什么?

UPDATE: 如果你问我为什么有负差——因为投入领域与投入国之间有太大的空间。

问题回答
/* Remove button padding in FF */
button::-moz-focus-inner {
    border:0;
    padding:0;
}

休尔后, Chrome子也出现在 Chrome和 Firefox。

尽管你是不同浏览器的开发商测试,并且看到了纽芬兰语的差异,但用户不会。 把重点放在用户获得通知的东西上太容易了:用户可能具有“纳尔”或其他“埃”或“ Chrome”,但并非全部。 用户在一段时间内总是开关浏览器,更不用说在他们之间开关,并抱怨几个餐厅。

因此,如果你在某一个浏览器时考虑一下子群和这方面的经验,如果它在这种经验/浏览器方面做得很好,则不会花更多的时间。 而是继续走到下一步。

这正是为什么,但有些人则解释说了这一点。

构成要素使(作为违约)根据本组织和(或)浏览器而有所不同。 如果你想要你的形式要素(投入领域、提交纽芬兰等)在所有情况下都看齐,那么你就必须使用边界、婚礼和间隙来明确描述这些要素。

引言

/* Browser Firefox to match the Chrome */
#buttonid::-moz-focus-inner, .buttonclass::-moz-focus-inner, button::-moz-focus-inner {
    padding: 0 !important;
    border: 0 none !important;
}

这里没有人要提到的是,CSS对这些要素的 Chrome树:

input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="file"]::-webkit-file-upload-button,
button

无论如何,只要我能知道,你会把dding子放在首位。 我尝试使用<代码>! 进口以及其他技术,但还没有uck。 如果任何人对这一点有任何了解,我会爱知。

使用<代码>-webkit- Box-sizing:content- Box,然后阅读关于方框-模型。

我现在试图同时改变高点和dding子。

其结果非常好。 两个浏览器(FF和Accent)均正确。

.classname {
height:20px;
    padding:4px;
}

也许这只是我的uck日......但你可以尝试。

为了在两个浏览器上达到同样规模,你必须把同样的初步价值设定给所有中心要素,如重新设定。

This is how I fixed the problem: put this at the beginning of your css file

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td, a
    {
      margin-top: 0px;
      margin-right: 0px;
      margin-bottom: 0px;
      margin-left: 0px;
      padding-top: 0px;
      padding-right: 0px;
      padding-bottom: 0px;
      padding-left: 0px;
      border-top-width: 0px;
      border-right-width-value: 0px;
      border-bottom-width: 0px;
      border-left-width-value: 0px;
    }

现在,你不得不在你的网页上确定一些方面的变化,但在所有浏览器上,情况几乎相同。





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签