Solved

how to make the lable two lines on the button?

Posted on 2003-10-22
7
194 Views
Last Modified: 2010-04-06
Hi Experts,

I just wonder if it is possible to make the long "value" of the button split into two lines on the button instead of using a long button?


thanks.
0
Comment
Question by:panpioneer
7 Comments
 
LVL 17

Expert Comment

by:dorward
ID: 9599342
No (well - perhaps in a small number of browsers, but you shouldn't be able to).

If the text is that long I suggest you ask yourself:

1 - Can the same meaning be communicated with less text?
2 - Does all of the text need to be on the button?
0
 

Author Comment

by:panpioneer
ID: 9599367
Unfortunately, it is not my decision, our users ask for it.
0
 
LVL 16

Expert Comment

by:jaysolomon
ID: 9599796
Ever thought about creating an image?
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 16

Accepted Solution

by:
jaysolomon earned 20 total points
ID: 9599819
but if you insist the only way is javascript

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function init(){
document.forms[0].btn.value = "blahblahblahblah\nblahblahblahblah";
}
// -->
</script>
</head>
<body onload="init();">
<form name="form1" method="post" action="">
<input type="button" name="btn" value="">
</form>
</body>
</html>
0
 
LVL 1

Expert Comment

by:paStiSSet
ID: 9599833
you can use an image wich will work as a button, you only need to draw button with the two lines (use paint or something else). once you have the image you can use a javascript.

try this:

<html>
<body>
<style>
<!--
.mouseBeOffMe {
border-top:    10px  solid #FFFFFF;
border-bottom: 10px  solid #FFFFFF;
border-left:   6px   solid #FFFFFF;
border-right:  10px  solid #FFFFFF;
}
.mouseBeOnMe {
border-top:    6px   solid #FFFFFF;
border-bottom: 14px  solid #FFFFFF;
border-left:   10px  solid #FFFFFF;
border-right:  6px   solid #FFFFFF;
}
.mouseBeDown {
border-top:    13px  solid #FFFFFF;
border-bottom: 7px   solid #FFFFFF;
border-left:   10px  solid #FFFFFF;
border-right:  6px   solid #FFFFFF;
}
.mouseBeUp {
border-top:    10px  solid #FFFFFF;
border-bottom: 10px  solid #FFFFFF;
border-left:   10px  solid #FFFFFF;
border-right:  6px   solid #FFFFFF;
}
//-->
</style>

</HEAD>
<BODY>

<center>
<img src="button.gif" border="0" class="mouseBeOffMe" onmouseover="this.className='mouseBeOnMe'" onmousedown="this.className='mouseBeDown'" onmouseup="this.className='mouseBeUp'" onmouseout="this.className='mouseBeOffMe'">
</center>
<-eof->

this will work as a button, you only need to <form>'it :)
0
 

Author Comment

by:panpioneer
ID: 9600219
thanks. I tried Jay's idea which looks pretty simple. Strangely, it works on a simple htm page, but when I move the codes to my JSP page, it does not work. Any clue why?
0
 
LVL 16

Expert Comment

by:jaysolomon
ID: 9600258
i no nothing about jsp pages, but i assume you may have a syntax erro some where or something
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
iOS retina Display, HTML Email Signature 5 535
Windows Standards for file storage. 3 36
What language/protocol is the Angular Chat? 2 95
removing a class in javascript 4 74
When you work with shopping cart / ecommerce relates web sites, you need to pass the certain form post details to the payment gateway process page with required details for the products items you give to order. Also you may need to track the ordered…
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

730 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question