CODEWITHSUNDEEP
htmlcssinternet-explorer-7internet-explorer-6word-wrap
FoF
FoF

Reputation: 195

Input value text wrap for IE6 & IE7

I am trying to create an input of type submit that would contain a quite long text as a value. I would like this text to wrap according to the input width. If I add word-wrap:break-word and while-space:normal it works ok for most browsers but not for IE6 & IE7 which I need as well. Is there a way to achieve this for IE6-7?

<input type="submit" class="button" style="word-wrap:break-word;white-space: normal;"  name="custom_btn" value="{% trans "Lorem Ipsum is simply dummy text of the printing"%}" onclick=""/>

*I am using django for the backend

Upvotes: 0

Views: 993

Answers (2)

Seimen
Seimen

Reputation: 7250

Generally a <button type="submit"></button> does submit the form it is embedded in, but it does not pass a value itself, unlike the <input type="submit" /> with a value attribute (so you can check server-side if the button has actually been clicked).

If you don't have to check against the action, then you can use a button type submit like Justin suggested and you normally wouldn't even have to set breaks or any extra css. Text within a button which has a specified width is wrapped correctly because there is an isolation between the DOM-Element (<button></button>) and its content, whereas in an input the displayed text is set as an attribute of the DOM-Element itself.

Upvotes: 1

Justin
Justin

Reputation: 3039

You should be able to use the button tag. It allows for multi line buttons because it acts more like a standard elment. Though in ie (6,7) I belive it will only submit the data in between the tags, so we use some light javascript to get around that.

<button type="button" onClick="document.myForm.submit()">
First Line<br />
Second Line<br />
Third Line<br />
</button>

Now I havn't used the button element a lot my self, but it should work fine with the javascript on there.

Upvotes: 1

Related Questions