一旦我们点击按钮，文本框就会拉伸并向上移动答案

【问题标题】：textbox is stretching and moving upside once we click on button一旦我们点击按钮，文本框就会拉伸并向上移动
【发布时间】：2016-02-05 17:11:25
【问题描述】：

请访问link

这是我们可以购买产品的电子商务网站。

请点击“添加到购物车”按钮，您可以看到：

这是布料产品，我们必须先选择“颜色”和“字符”，然后点击“加入购物车”。如果我们先选择“颜色”和“字符”，那就没有问题了。但是如果我们直接点击添加到购物车，不仅仅是问题，“颜色”旁边的文本框会拉伸并且不会向上移动。

我想要的是，如果我们直接点击“添加到购物车”，它也应该像以前一样只显示 [css 部分]

【问题讨论】：

请问css是什么写的？

标签： css magento

【解决方案1】：

您需要对 styles.css 进行以下更改

行号：282

.validation-advice { clear:both; min-height:13px; margin:5px 0; padding-left:13px; padding-top:2px; line-height:13px; background:url(../images/validation_advice_bg.png) 0px 3px no-repeat; color:#e70808; float:left; width:70%; text-align:left}

第 1953 行，其中 cmets 是 /vikas/

  #product-options-wrapper dl dt {
       display: inline-block;
      margin-top: 13px;
  }

 #product-options-wrapper dl dd {
   display: inline-block;
   vertical-align: top;
  }

 #product-options-wrapper dl dd { width: 35%; }

行号：1036

.product-options dd select { /*width:100%;*/ margin-bottom:5px; height:auto}

让我知道这是否适合你。

快乐编码...

【讨论】：

【解决方案2】：

试试这个

  .validation-advice{   /**add few property in this class**/
        position: absolute;
        width: 100%;
        bottom: -11px;
    }  

    #product-options-wrapper dl dd{  /**add relative here **/
    position:relative;
    }

【讨论】：

【解决方案3】：

尝试实施以下更改：

https://gyazo.com/c30af863033c32797f3f1435a37adef8 position:relative - 用于父容器。 https://gyazo.com/1b5fd06e48cb8b0530f898ae8b968a35 - 位置：绝对；顶部：30px；左：0px；宽度：自动； - 对于消息块。

但要小心！如果您使用此解决方案，您应该始终保持主块下方的空间比消息的高度大一点。

另外，请添加 top:0;对于以下块： https://gyazo.com/01519f7a4e4d7325d3946e4c70c00122

它应该“卡”在窗口的上部，没有空间： https://gyazo.com/13010dd395ca5bb18367daa670943fc6

【讨论】：