How to to get my text to wrap within a div?

#word {
  font-weight: bold;
  width: 20px;
  height: 100%;
  background-color: #0f3039;
开发者_开发问答}

#answer {
  width: 285px;
  height: 25px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
  padding-top: 15px;
  background-color: #0f3039;
  margin-left: 348px;
  font-size: 16px;
  margin-top: 0px;
}

<div id="answer" style="display:none;">
  Go With: <span id="word"></span>
</div>

I'm trying to make the text stay within boundaries, but it's not wrapping correctly. Not sure what needs to be changed.

try white-space possible values

white-space: none;
white-space: nowrap;
white-space: pre;
white-space: pre-wrap;      
white-space: pre-line;      
white-space: inherit;

You are using span which is an inline element. On an inline elemnet you can not set the width.

Change it to display: block;

Check out the fiddle: http://jsfiddle.net/zasDb/1/

Or even better display: inline-block;

But I don't know whether IE supports this.