Html 保持文本、文本字段和；按钮

拜访

使用CTRL+F搜索“check”，您可以看到：

我想像这样展示

我需要4个变化如下

1） 我想更改“check Availability at”文本的字体大小和字体系列

2） 文本、文本字段和按钮之间的间距应相同

3） 当我们在文本字段中输入数字时，它应该在开头显示位空间，如链接2中所示

4） 隐藏块下方和上方之间的空白间隙

.shipping-estimation-form {float: left;margin: 0 auto;padding: 0;width: 50%;}
.check_delivery .actions {float: left;width: 25%;}
.check_delivery .f-right {margin-left: 0 !important;}
.check_delivery .f-right, .right {float: left !important;}
.check_delivery .button > span {background: #565656 none repeat scroll 0 0; width: 100% !important;}
.check_delivery .button span {padding: 3px;text-transform: capitalize !important;}
.check_delivery .item.last.odd { padding: 0;}
.check_delivery .block-subtitle {float: left;margin-top: 10px;padding-left: 10px;  width: 21%; font-size:12px; position:relative;left:50px;}
.check_delivery #estimate_postcode {margin: 0 auto !important;padding: 0 !important;width: 50% !important; position:relative; left:100px;}
.check_delivery .search {margin: 0 auto !important; width: 100%;}

.check1 {
    float: left;
    text-align: center;
    width: 90%;
    font-size: 17px;
}

.ikon {
    position: relative;
    top:50px;
}

关于检查按钮，它没有正确制作。将其设置为“提交”按钮并应用边距

---

关于检查按钮，它没有正确制作。将其设置为“提交”按钮并应用边距如果您希望块像文本一样反应，请尝试使用“显示：内联块”。

---

要设置单词之间的距离（如果是内联块，则设置块之间的距离），请尝试使用“单词间距：10px”

如果希望块的反应类似于文本，请尝试使用“显示：内联块”。

---

要设置单词之间的距离（如果是内联块，则设置块），请尝试使用“单词间距：10px”

请替换下面的css

.check_delivery .block-subtitle {
  display: inline-block;
  float: left;
  font-family: Museo,Helvetica,arial,san-serif;
  font-size: 15px;
  margin-top: 6px;
  padding-left: 60px;
  width: 27%;
}

.shipping-estimation-form {
  float: left;
  margin: 0 auto;
  padding: 0;
  width: 30%;
}

.check_delivery #estimate_postcode {
  float: left;
  margin-bottom: 0 !important;
  margin-left: 10px !important;
  margin-right: 10px;
  margin-top: 0 !important;
  padding: 0 0 0 10px !important;
  width: 70% !important;
}

---

请替换下面的css

.check_delivery .block-subtitle {
  display: inline-block;
  float: left;
  font-family: Museo,Helvetica,arial,san-serif;
  font-size: 15px;
  margin-top: 6px;
  padding-left: 60px;
  width: 27%;
}

.shipping-estimation-form {
  float: left;
  margin: 0 auto;
  padding: 0;
  width: 30%;
}

.check_delivery #estimate_postcode {
  float: left;
  margin-bottom: 0 !important;
  margin-left: 10px !important;
  margin-right: 10px;
  margin-top: 0 !important;
  padding: 0 0 0 10px !important;
  width: 70% !important;
}

---

---

这些都是您需要的基本css样式。您附加的css似乎与您的问题基本无关。如果需要帮助，请尝试创建一个最小的示例。什么部分给你带来麻烦，因为目前它看起来像一个“我不知道css”的问题。我不太熟悉css，请检查问题中的4个问题。第一部分给你更多的问题。你尝试了什么？因为你的要求似乎很简单，即使用谷歌搜索一下。@Pogrindis是的，我试着给字体大小赋予更多的值。但这将是下一行。这些都是您需要的基本css样式。您附加的css似乎与您的问题基本无关。如果需要帮助，请尝试创建一个最小的示例。什么部分给你带来麻烦，因为目前它看起来像一个“我不知道css”的问题。我不太熟悉css，请检查问题中的4个问题。第一部分给你更多的问题。你尝试了什么？因为你的要求似乎很简单，即使用谷歌搜索一下。@Pogrindis是的，我试着给字体大小赋予更多的值。你能给我一些代码来增加“check delivery availability”的字体大小吗？当我改变到更多的时候，它会显示在两行中。check_delivery.块字幕{float:left；margin top:10px；padding left:10px；/*width:21%；*/字体大小：15px；position:relative；left:50px；}请给我更改“按钮”设计的代码。请自己动手！别浪费时间。只需设计一个名字，你能给我一个代码来增加“check delivery Availability”字体大小吗？当我切换到更多的时候，它会显示在两行中。check_delivery.block副标题{float:left；margin top:10px；padding left:10px；/*width:21%；*/字体大小：15px；position:relative；left:50px；}请给我更改“按钮”设计的代码。请自己动手！别浪费时间。只需设计一个名称我尝试了

display:inline block

但不起作用，仍然“Check availability at”显示在两行中。我尝试了

display:inline block

但不起作用，仍然“Check availability at”显示在两行中。完美，这是我需要的。完美，这是我需要的。