在按钮内的文本旁边显示图像的问题

Question

所以我在bootstrap中的div里面有一个按钮，想在文本下面显示它，但是我在将图像放在“开始”旁边并将按钮放在正确的位置时遇到问题。任何帮助将不胜感激。

    #tech-support {
      margin: 0 auto;
      border: 0px solid #ffad41;
      -webkit-border-radius: 16px;
      -moz-border-radius: 16px;
      border-radius: 16px;
      font-size: 38px;
      font-family: arial, helvetica, sans-serif;
      padding: 24px 24px 24px 24px;
      text-decoration: none;
      display: inline-block;
      text-shadow: 0px 0px 0 rgba(0, 0, 0, 0.3);
      font-weight: bold;
      color: #FFFFFF;
      background-color: #ffc579;
      background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc579), to(#fb9d23));
      background-image: -webkit-linear-gradient(top, #ffc579, #fb9d23);
      background-image: -moz-linear-gradient(top, #ffc579, #fb9d23);
      background-image: -ms-linear-gradient(top, #ffc579, #fb9d23);
      background-image: -o-linear-gradient(top, #ffc579, #fb9d23);
      background-image: linear-gradient(to bottom, #ffc579, #fb9d23);
      filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffc579, endColorstr=#fb9d23);
      text-align: center;
    }
    #tech-support:hover {
      border: 0px solid #ff9913;
      background-color: #ffaf46;
      background-image: -webkit-gradient(linear, left top, left bottom, from(#ffaf46), to(#e78404));
      background-image: -webkit-linear-gradient(top, #ffaf46, #e78404);
      background-image: -moz-linear-gradient(top, #ffaf46, #e78404);
      background-image: -ms-linear-gradient(top, #ffaf46, #e78404);
      background-image: -o-linear-gradient(top, #ffaf46, #e78404);
      background-image: linear-gradient(to bottom, #ffaf46, #e78404);
      filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffaf46, endColorstr=#e78404);
    }
    #support-image {
      display: inline-block;
    }

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
  <div class="col-md-12">
    <div class="support-box">
      <h3>Start a Live Chat with one of our Tech Team</h3>
      <button class="btn btn-info btn-lg" id="tech-support" type="button">
        <h3>Start</h3>
        <img src="img/button-icon-livechat.png" id="support-image" class="img-responsive" />
      </button>
    </div>

它应该看起来像https://gyazo.com/d70db6a305892460289f84d3dcc6cf2d，顺便说一句，我正在使用bootstrap。

提前致谢:)。

Answer 1

您需要将h3的默认显示重置为：

private String a; //Getter setter for a
em.createNamedQuery("NamedQueryName").setParameter("param", a)

button h3 {
  display:inline-block;
  }

#tech-support {
      margin: 0 auto;
      border: 0px solid #ffad41;
      -webkit-border-radius: 16px;
      -moz-border-radius: 16px;
      border-radius: 16px;
      font-size: 38px;
      font-family: arial, helvetica, sans-serif;
      padding: 24px 24px 24px 24px;
      text-decoration: none;
      display: inline-block;
      text-shadow: 0px 0px 0 rgba(0, 0, 0, 0.3);
      font-weight: bold;
      color: #FFFFFF;
      background-color: #ffc579;
      background-image: -webkit-gradient(linear, left top, left bottom, from(#ffc579), to(#fb9d23));
      background-image: -webkit-linear-gradient(top, #ffc579, #fb9d23);
      background-image: -moz-linear-gradient(top, #ffc579, #fb9d23);
      background-image: -ms-linear-gradient(top, #ffc579, #fb9d23);
      background-image: -o-linear-gradient(top, #ffc579, #fb9d23);
      background-image: linear-gradient(to bottom, #ffc579, #fb9d23);
      filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffc579, endColorstr=#fb9d23);
      text-align: center;
    }
    #tech-support:hover {
      border: 0px solid #ff9913;
      background-color: #ffaf46;
      background-image: -webkit-gradient(linear, left top, left bottom, from(#ffaf46), to(#e78404));
      background-image: -webkit-linear-gradient(top, #ffaf46, #e78404);
      background-image: -moz-linear-gradient(top, #ffaf46, #e78404);
      background-image: -ms-linear-gradient(top, #ffaf46, #e78404);
      background-image: -o-linear-gradient(top, #ffaf46, #e78404);
      background-image: linear-gradient(to bottom, #ffaf46, #e78404);
      filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#ffaf46, endColorstr=#e78404);
    }
    #support-image {
      display: inline-block;
    }

button h3 {
  display:inline-block;
  }