Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Placing a text box on a image... c#

Posted on 2014-07-20
4
Medium Priority
?
401 Views
Last Modified: 2014-07-20
As shown below, there is an image filling the entire  <td> tag.
	<td class="middleButton fontAndBackgroundColor">
         <img src="images/Button.png" width="200px" height="60px" />
        <!-- <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>-->
    </td>

Open in new window


How can a text box, label, or anything else could sit on the same <td> tag show a date?

--------------------------------------------------------
|            Button Caption here                     |<-- this is Button.png with a fixed caption on it.
|                                                                   |     (the caption is a part of the image)
|                                                                   |
|                   July 19, 2014  <-----------------|------ this date will have to change once in a while.                         |
--------------------------------------------------------             (the date is not a part of the image)

The work is done in asp.net, c#. The date is superimposed on the image.

Thank you.
0
Comment
Question by:Mike Eghtebas
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 7

Accepted Solution

by:
Raghu Mutalikdesai earned 2000 total points
ID: 40207229
Instead of placing image inside the <td>, you must use the image as a background in order to achieve super imposing:
<td style="background-image: url('images/Button.png'); background-repeat: no-repeat; background-position: left top; height: 120px; vertical-align: bottom;"><asp:TextBox ID="TextBox1" runat="server"></asp:TextBox></td>

Open in new window

There are 2 key factors:
1. Height of the cell
2. Vertical alignment of the cell

Make sure you set the height that is a sum of image height and the text box height (at the least). Also, because cell's vertical alignment is set to bottom, the text box is forced to bottom of the image.

Also, just to ensure image is shown correctly, use background-size: 120px 80px; inside the style attribute.

And the values I have used for height, width etc. (in pixels) are sample values. You must change these as per your needs.
0
 
LVL 34

Author Closing Comment

by:Mike Eghtebas
ID: 40207520
Thank you.
0
 
LVL 7

Expert Comment

by:Raghu Mutalikdesai
ID: 40208264
Good to hear that it helped you! Thanks
0
 
LVL 34

Author Comment

by:Mike Eghtebas
ID: 40208295
Yes, I had started a process that one draws on the image the required text on the fly. It is good technique but awfully hard compared to your good solution.

Thanks,

Mike
0

Featured Post

New feature and membership benefit!

New feature! Upgrade and increase expert visibility of your issues with Priority Questions.

Question has a verified solution.

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

Entity Framework is a powerful tool to help you interact with the DataBase but still doesn't help much when we have a Stored Procedure that returns more than one resultset. The solution takes some of out-of-the-box thinking; read on!
A while back, I ran into a situation where I was trying to use the calculated columns feature in SharePoint 2013 to do some simple math using values in two lists. Between certain data types not being accessible, and also with trying to make a one to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

722 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