创建一个表单输入样式为文本 - 要包装

时间:2016-02-23 16:18:02

标签: html css word-wrap

我有一个表单按钮输入样式为文本, 我希望该文本根据被困的DIV的宽度进行换行。 但它没有

See Fiddle Here

CSS:

.content {
width:125px;height:180px;float:left;color:black;background:white
}
.text{overflow:visible;margin:0;padding:0;border:0;color:blue;background:0 0;font:inherit;text-decoration:none;cursor:pointer;-moz-user-select:text;line-height:normal}
.text:focus,.text:hover{color:#333;text-decoration:underline}
.text::-moz-focus-inner{padding:0;border:0}

HTML:

  <div class="content">
    <form action="a.php" method="POST" target="_blank">
    <input type="submit" class="text" value="Some Very Long Text Here Doens't Wrap">
    </form> 
  </div>

1 个答案:

答案 0 :(得分:2)

word-break: break-word;white-space: normal;添加到输入标记中。喜欢这个

.text {
  word-break: break-word;
  white-space: normal;
  overflow: visible;
  margin: 0;
  padding: 0;
  border: 0;
  color: blue;
  background: 0 0;
  font: inherit;
  text-decoration: none;
  cursor: pointer;
  -moz-user-select: text;
  line-height: normal
}

在这里工作JSFiddle https://jsfiddle.net/bw74vxwd/6/