header text going on two lines - html

I have a gridview in which one of my column's header text is going on two lines, which look very ugly,
I added item width and header width but no good,
<asp:BoundField DataField="userID" ReadOnly="true" HeaderText="User ID But Only ID" HeaderStyle-Width="300px"
ItemStyle-Width="300px" />
Anyone guide me to right direction as I want User ID But Only ID in 1 line in header

Related

How do I keep a list of images from resetting when I choose one?

I am using ASP.NET web forms to design a site. One of the pages uses a <DIV> to hold a scrolling list of asp:ImageButton controls, each of which displays an image. The goal is to be able to display a long list of images inside a scrollable DIV tag, making it easier for the user to choose one without using a third-party control and avoiding controls that require paging. Here's a sample of the DIV I've built:
<div id="divOne" runat="server" style="height: 230px; width: 330px; overflow: auto;text-align: center;">
<asp:ImageButton runat="server" ImageUrl="../Images/image1_small.jpg" AlternateText="Image #1" CommandArgument="Image #1" OnClick="ImagePicked" /><br />
<asp:ImageButton runat="server" ImageUrl="../Images/image2_small.jpg" AlternateText="Image #2" CommandArgument="Image #2" OnClick="ImagePicked" /><br />
...
</div>
When the user clicks an image, it triggers an action to update another part of the page. But the problem is that when the image is clicked and the action fires, the list of images resets back to the first one at the top of the list.
I tried using an UpdatePanel to control this, but it still happens. Is there any way to prevent the list of images from resetting?
If you just want to save scroll position after postback, there are several ways to do it. The simplest one is to save scroll position with javascript whenever onscroll event triggers, then restore saved value on page load, as shown here:
Maintain scroll position of a div within a page on postback
If that doesn't quite work for you, you can try storing scroll position in a hidden field (see this answer: https://stackoverflow.com/a/1184659/1202275). Some also suggest to store it in a cookie, but that can backfire if a person using the page has cookies disabled for any reason.
Hope that helps!

Email Subtitle - Is there an easy way to do this?

I am using a header and footer which I upload to my companies campaign manager program. This header and footer cannot be changed. But I want to change the subtitle which appears on some email clients after the Subject next to the unopened email (which currently has the first line of the email which is "click here if email has not loaded"). Is there anyway I can change the subtitle through the content beneath the header? If not is there a way I can have a subtitle which is not "click here" which does not appear directly on my email.
I really don't see a way to do this without being able to edit the email header contents (which is where I assume this "Click here" text is located).
In the past to correct a similar issue, I have either moved that text down farther into the content or footer of the email, or replaced it with an image (having alt text to show in case images do not load). The latter choice is a matter of personal preference and probably not ideal. That said, however, these solutions require changing the header.
To change it you need access to the Header Contents
To change the preview of your email you can only use a hack. As it will always display the first lines of your email, you'll have to edit your email template to start it with whatever catchphrase you want in your email preview.
However, I'm pretty sure you don't want to add an extra sentence that will display before your email so here is the trick: use a 1px by 1px transparent gif with your catchphrase in the ALT tag.
<img alt="YOUR CATCHPHRASE" src="your-transparent-gif.gif" width="1" height="1" border="0">

Divs won't position correctly

Im trying to display my web app using divs however it doesnt seem to display properly. I want the title, picture the left description on the right of the picture, I've managed to get this correct.
However then I want my portion number, preparation time, utensils, ingredients and finally method in that order to just flow in that order. However it's not working, I've created a JsFiddle would be great if you could update it and help.
<div id="description">
<p class="textDes">
<label for="descrip">Enter a recipe Description</label>
<input type="text" name="descrip" >
</p>
</div>
Like this picture
Add clear: left to #portionPrep and don't float the divs inside it
Fiddle

h:inputTextArea scrolling automatically to the bottom of the line that is edited

I have defined an inputTextArea as follows:
<s:div id="editor">
<h:inputTextarea id="mytext" styleClass="editorTextInput" value="# {algorithm.script}"/>
</s:div>
The content is larger that the editor so scroll bars appears automatically.
The problem (which might be a feature that I do not want) is that each time a key is pressed to edit some content (change a word/char or add a word/char) a scrolling is automatically trig-erred so that the line edited is the last visible line in the inputTextArea.
I have not defined any script or attached any event on the div or the inputTextArea.
I have tried to attach events that do nothing but did not work either
<s:div id="editor">
<h:inputTextarea id="mytext" styleClass="editorTextInput" onkeydown="doNothing()" onkeypress="doNothing()" onkeyup="doNothing()"value="# {algorithm.script}"/>
</s:div>
Thanks

show full text on mouse over or hover on a <p:commandLink>

One of the table column displays commandLink in its rows, whose value is a long text. I am displaying only a portion of that text and when a user hovers on the link I want a pop up or something that will display the full text and hide it when the mouse is away.
How would I approach this, tried ajax event but didn't work.
Its
Thanks
In case anyone is wondering, this is what I did finally using tooltip...
<div id="sub" style="width:175px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;">
<p:commandLink id ="myLink" value="#{message.subject}" ajax="true"
update=":messageForm:grid">
<f:setPropertyActionListener value="#{message}"
target="#{myBean.selectedMessage}"/>
</p:commandLink>
<p:tooltip for="myLink" value="#{message.subject}" showEffect="slide" hideEffect="slide" style="background-color:#FFFFCC;border:1px dotted #000000;" />
</div>