Textbox cursor landing in the middle instead of beginning of line - html

I am making a page where I try to allow people to write about parks they know about. A problem I am having is that when a person tries to edit a park, the cursor in the text area ends up what seems to be 1 tab over from the beginning.
Here is an example:
http://www.comehike.com/outdoors/parks/park.php?park_id=447
On the left column, if click on "Write and share what you know about this topic" you will see that the cursor doesn't end up in the beginning of the text area.
Any idea why this is happening and how to fix it?
Thanks!!

get rid of the space between the textarea tags and that will solve that problem:
<textarea> </textarea>
<textarea></textarea>

There's obviously data (looks like 2 tabs) being output in the value of the textbox, or is stored in the database with the existing data.
Ah yes, it's between your textarea tags. Remove the tabs.

Related

Empty textbox in grid showing square brackets

We have a scenario wherein we have a editable gridview. Users enter data and submit. On submission we send the grid data as html in an email. The issue we are facing is that if a textbox is left empty it shows [ ] square brackets. These look very annoying. Kindly see screenshot the last bottom box is highlighted in red.
Kindly let know how we can make that square brackets gp away / donot show up.
Missed to update the post for the answer. This issue happens when we are developing Visual Web part in SharePoint. And the Column type is Multiple Lines of text with option set to 'Enhanced rich text (Rich text with pictures, tables, and hyperlinks)'. Set it to 'Plain Text' and the boxes will go away.

Html Page: Inputed text cut off in comment box

Issue: Webpage Comment section malfunction - If written text in any of the individual lines exceeds the size of the comment box it will continue to allow imputed text on that comment line resulting in lost text as it will not automatically wrap text onto the second line and onto the third comment line. Any text not typed within that goes past the size of the comment box is lost when printed.
This results in an enormous amount of lost data that I require to complete modifications to the specific needs of each customer.
Below is the webpage and comment box is on the bottom.
http://maxshepherdboltproducts.com/LW_SNP_DAT.html
I appreciate you're time and knowledge provided to help resolve this problem. - The Noob
You should use texarea instead of <input type="text">.
this will solve your problem.
with the help of css you can control textarea.
like word-wrap property.

Close tags dropping below highlighted line

I have minimal experience with HTML script so this may all go horribly wrong here.
Alright so I have a very simple yet very time consuming task of taking complete papers and converting them into HTML script. I'm using Sublime Text 3 with Emmet plugin.
Basically,
This is the first header
This is the first paragraph that needs to be tagged
This is the second header
This is the second paragraph that needs to be tagged
So super simple I need to put header tags on the headers and paragraph tags on the paragraphs.
What I have been doing is holding Ctrl and manually highlighting the desired text as it is all rather random. Problem is that takes forever to manually highlight the text like that.
I am aware of other ways to highlight such as Ctrl + L for the line. Problem is my close tags end up under the highlighted line.
Example:
<h2>This is the first header
</h2><p>This is the first paragraph that needs to be tagged
</p>
It's not a big deal but it makes the code harder to go through later and really chaotic.
The same problem persists if I click the corresponding number of the line.
Seeing as I have hundreds of pages to enter and even more headers, paragraphs, and pictures to properly tag; I'm looking for a solution to the tag dropping below the line or a faster method to entering text.
So, is there a fast method for entering text from a word document to Sublime text and quickly get the corresponding tags? e.g. <h2>,<h3>,<p>,<ul>,<li> and so on.
Any help will save my sanity, thanks.
When you select a line with CtrlL, it automatically selects the entire line, and moves the cursor down to the first position on the following line. There are two ways around this. The first is to place the cursor in the first position on the line you want to select, then just hit ShiftEnd and the line will be selected, with the cursor now sitting in the last position on that same line. Alternatively, use CtrlL, then hit Shift← (left arrow) to move the cursor from the first position on the next line to the last position on the selected line. Either way, you can now hit the key combo in Emmet for inserting a tag pair, and you're all set.

How can I place <a> tags over another (greater) <a> tag?

Here's the case: I have a series of thumbnails in a page, and I would like to display several keywords over each image when the user hovers with the cursor. Each of those keywords are anchor tags that point to a search query. And each thumbnail (the image) should also be clickable (through the empty spaces that the keywords leave) and point to a specific page.
I have everything already coded, I'm just missing a way to display the keyword anchors over the image anchors. I already tried with an onclick="window.location.href=..." but when the user clicks the keyword, the onclick is also triggered (for instance: if I ctrl+click on a keyword, i get the keyword search on a different window, but the main window content changes as well).
Any help will be much appreciated. Thanks!
This is quite common and can definitely be done with plain HTML and CSS. You can also do it with JavaScript, but I prefer to avoid doing so if possible.
This example is perfectly valid HTML/CSS and should have no weird browser rendering issues (even as far back as IE 6).
http://jsfiddle.net/2JD76/1/
Basically you have a containing element, in this case a div, which has your linked thumbnail and linked keywords. They're hidden by default and only shown when the containing div is hovered.
The linked thumbnail is absolutely positioned so that it's taken out of the page flow which then allows the linked keywords to appear on top. I then use z-indexes to make sure that the keywords are always on a layer that is higher than that of the linked thumbnail.
You can not. It is illegal html.
Attach a click handler that changes the current location instead of the "greater ".
I was going to answer with a long reply but, well check out my Jsfiddle here. I was trying to solve something before and well...check it out.
http://jsfiddle.net/somdow/KSt6a/
If you look at the code, its doing exactly what you are describing.
On my Jsfiddle, theres a div box with space for an image(this is wher YOUR image would go), The image is on the code but not on the jsfiddle so youll see the alt tag....Anyways so, on mouse-over, it brings up another div with text dynamically created inside of it.
All you have to do is replace the image content with your own image, then Insert the links/keywords links you want into this line
.prepend('<div class="portSecRollOver"><div class="portSecInner"></div></div>');
and stick your words in between the <div class="portSecInner"> **YOUR WORDS HERE** </div> line
And change the CSS to fit your needs.
oh AND ps, DELETE this line (below) which is the one that dynamically appends text inside of "portSecInner", since your going to insert your own words, then you dont need this line.
$(this).find('.portSecInner').html("<h3 class='h34roll'>" + $(this).find('img').attr("alt") + "</h3>");

Google Chrome textareas wrapping and adding line breaks

I've got a problem with textarea's in Google Chrome. I'm using classic ASP, but this is unimportant as Chrome is actually posting the data incorrectly.
The problem is with a text area. As soon as a string of text is too long to fit one line of the text area, it wraps to the next line (as it should).
My problem is that when submitted, the form data contains a CarriageReturn & LineFeed at every spot where the text wrapped, as well as user generated enter/return events - I can't even tell the difference between the two.
Does anyone know how to fix this? Possibly an option in the text area or something? All other browsers only add CarriageReturns and LineFeeds where the end user has actually put them in.
This should only happen if you set the wrap="hard" attribute on the textarea.
Do you have wrap="hard" set on the textarea ? If so, remove it. If not, can you try setting wrap="soft" as attribute?