Inside a `&lt;li&gt;` you can have anything you could naturally put inside a `&lt;div&gt;`. They are no different in this sense.

It should be valid in HTML4, XHTML and HTML5 as well.

This is **NOT** valid though (so the sources you found about &quot;no divs in lists&quot; could refer to this situation):

    &lt;ul&gt;
        &lt;li&gt;&lt;/li&gt;
        &lt;div&gt;&lt;/div&gt;
        &lt;li&gt;&lt;/li&gt;
    &lt;/ul&gt;

**So:** Lists (`ul`, `ol`) can only have `li`s as their children. But `li`s can have anything as their children.

Because `&lt;li&gt;` is a block element, not an inline element like `&lt;span&gt;` or `&lt;a&gt;`.

An `&lt;li&gt;` is a block element, and will work perfectly fine with other block elements inside.

Is there any replacement for python `StringIO` class, one that will work with `bytes` instead of strings?

It may not be obvious but if you used StringIO for processing binary data you are out of luck with Python 2.7 or newer. 

StringIO replacement that works with bytes instead of strings?

I have the following code

	var c = new Date(Date.parse(&quot;2011-06-21T14:27:28.593Z&quot;));
	console.log(c);
	
On Chrome it correctly prints out the date on the console. In Safari
it fails. Who is correct and more importantly what is the best way
to handle this?



Date parsing in javascript is different between safari and chrome

Why is the following code valid when I am using a `&lt;div&gt;` inside a `&lt;li&gt;`?

    &lt;ul&gt;
        &lt;li class=&quot;aschild&quot;&gt;
            &lt;div class=&quot;nav&quot;&gt;Test&lt;/div&gt;
        &lt;/li&gt;
    &lt;/ul&gt;

Can I use a div inside a list item?

Why is the following code valid when I am using a <code>&#x3C;div></code> inside a <code>&#x3C;li></code>?
<pre><code class="hljs language-php-template">&#x3C;ul>
 &#x3C;li class="aschild">
 &#x3C;div class="nav">Test&#x3C;/div>
 &#x3C;/li>
&#x3C;/ul>
</code></pre>

I am struggling to find a clean solution to my problem and was wondering if anyone could offer some tips.

I have &quot;templates.html&quot; which contains a collection of HTML snippets which I want to load into JavaScript and use.  What is a good way to access the templates/snippets bearing in mind that templates.html is not a loaded DOM document?

I was thinking about using `document.open` to create a DOM to access but I think this has issues on certain browsers.

Load HTML template with JavaScript

I have a select box with some values. How do I get the selected options text, not the value?

    &lt;select name=&quot;options[2]&quot; id=&quot;select_2&quot;&gt;
        &lt;option value=&quot;&quot;&gt;-- Please Select --&lt;/option&gt;
        &lt;option value=&quot;6&quot; price=&quot;0&quot;&gt;100&lt;/option&gt;
        &lt;option value=&quot;7&quot; price=&quot;0&quot;&gt;125&lt;/option&gt;
        &lt;option value=&quot;8&quot; price=&quot;0&quot;&gt;150&lt;/option&gt;
        &lt;option value=&quot;9&quot; price=&quot;0&quot;&gt;175&lt;/option&gt;
        &lt;option value=&quot;10&quot; price=&quot;0&quot;&gt;200&lt;/option&gt;
        &lt;option value=&quot;3&quot; price=&quot;0&quot;&gt;25&lt;/option&gt;
        &lt;option value=&quot;4&quot; price=&quot;0&quot;&gt;50&lt;/option&gt;
        &lt;option value=&quot;5&quot; price=&quot;0&quot;&gt;75&lt;/option&gt;
    &lt;/select&gt;

I tried this:

    $j(document).ready(function(){
		$j(&quot;select#select_2&quot;).change(function(){
			val = $j(&quot;select#select_2:selected&quot;).text();
			alert(val);
		});
    });

But it&#39;s coming back with `undefined`.

Get text of the selected option with jQuery

When using jquery `.change` on an `input` the event will only be fired when the input loses focus

In my case, I need to make a call to the service (check if value is valid) as soon as the input value is changed. How could I accomplish this?

Detecting input change in jQuery?

How do I align entire html body to the center ?

How to align entire html body to the center?

How to use an html link to open the sms app with a pre-filled body?

Everything I have read seems to indicate that sms:18005555555?body=bodyTextHere

Should work, but on the iPhone, this doesn&#39;t work. If I take out the ?body=bodyTextHere, and just use sms:phonenumber, it works.

I have seen several instances where QR codes do this through a safari link. How are they able to pre-populate the body text?

How to pre-populate the sms body text via an html link

Is there any way to get facebook&#39;s crappy Open Graph meta tags to validate if my doctype is `&lt;!DOCTYPE html&gt;` (HTML5)?

Other than facebook&#39;s Open Graph meta tags, my document validates perfectly.

I really don&#39;t want to use `&lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML+RDFa 1.0//EN&quot; &quot;http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd&quot;&gt;` as that creates a whole new set of problems.

Here is an example of one of the validation errors in question...

Error Line 11, Column 47: Attribute property not allowed on element meta at this point.

    &lt;meta property=&quot;og:type&quot; content=&quot;website&quot; /&gt;

Any help would be appreciated... I have been searching off and on for days to no avail.

Open Graph validation for HTML5

I&#39;m running into a behavior I wasn&#39;t expecting when using Enum.TryParse.

If I have an enum:

    public enum MyEnum
    {
      ValueA,
      ValueB,
      ValueC
    }

And then I pass a numeric value (as a string) into Enum.TryParse, like:

    MyEnum outputEnum;
    bool result = Enum.TryParse(&quot;1234&quot;, out outputEnum);

Despite the string &quot;1234&quot; not being a possible value, result will come back as true, and my outputEnum will have a value of 1234. 

Is there a way I can avoid this sort of behavior? I&#39;m trying to write a function which will process arbitrary string input as an enum, and this has thrown a bit of a monkeywrench in my bad-input detection.

Enum.TryParse returns true for any numeric values

I have a curious problem with ASP.NET MVC3 client-side validation. I have the following class:

    public class Instrument : BaseObject
    {
        public int Id { get; set; }

        [Required(ErrorMessage = &quot;Name is required.&quot;)]
        [MaxLength(40, ErrorMessage = &quot;Name cannot be longer than 40 characters.&quot;)]
        public string Name { get; set; }
    }

From my view:

    &lt;div class=&quot;editor-field&quot;&gt;
        @Html.EditorFor(model =&gt; model.Name)
        @Html.ValidationMessageFor(model =&gt; model.Name)
    &lt;/div&gt;


And here&#39;s the generated HTML I get for the textbox for this field:

    &lt;input class=&quot;text-box single-line&quot; data-val=&quot;true&quot; data-val-required=&quot;Name is required.&quot; id=&quot;Name&quot; name=&quot;Name&quot; type=&quot;text&quot; value=&quot;&quot;&gt;

No sign of the `MaxLengthAttribute`, but everything else seems to be working.

Any ideas what&#39;s going wrong?


MaxLength Attribute not generating client-side validation attributes

I have an input that can have only 2 values `apple` or `banana`. What regular expression can I use to ensure that either of the two words was submitted?

Regex match one of two words

I&#39;ve created a custom ValidationAttribute that compares 2 dates and makes sure that the second date is greater than the first:

    public sealed class IsDateAfter : ValidationAttribute, IClientValidatable
    {
        private readonly string testedPropertyName;
        private readonly bool allowEqualDates;

        public IsDateAfter(string testedPropertyName, bool allowEqualDates = false)
        {
            this.testedPropertyName = testedPropertyName;
            this.allowEqualDates = allowEqualDates;
        }

        protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        {
            var propertyTestedInfo = validationContext.ObjectType.GetProperty(this.testedPropertyName);
            if (propertyTestedInfo == null)
            {
                return new ValidationResult(string.Format(&quot;unknown property {0}&quot;, this.testedPropertyName));
            }

            var propertyTestedValue = propertyTestedInfo.GetValue(validationContext.ObjectInstance, null);

            if (value == null || !(value is DateTime))
            {
                return ValidationResult.Success;
            }

            if (propertyTestedValue == null || !(propertyTestedValue is DateTime))
            {
                return ValidationResult.Success;
            }

            // Compare values
            if ((DateTime)value &gt;= (DateTime)propertyTestedValue)
            {
                if (this.allowEqualDates)
                {
                    return ValidationResult.Success;
                }
                if ((DateTime)value &gt; (DateTime)propertyTestedValue)
                {
                    return ValidationResult.Success;
                }
            }

            return new ValidationResult(FormatErrorMessage(validationContext.DisplayName));
        }

        public IEnumerable&lt;ModelClientValidationRule&gt; GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
        {
            var rule = new ModelClientValidationRule
            {
                ErrorMessage = this.ErrorMessageString,
                ValidationType = &quot;isdateafter&quot;
            };
            rule.ValidationParameters[&quot;propertytested&quot;] = this.testedPropertyName;
            rule.ValidationParameters[&quot;allowequaldates&quot;] = this.allowEqualDates;
            yield return rule;
        }

CalendarEntry class:
...

    public virtual DateTime StartDate { get; set; }
        
    [IsDateAfter(&quot;StartDate&quot;, true, ErrorMessage=&quot;End date needs to be after start date&quot;)]
    public virtual DateTime EndDate { get; set; }


VIEW:

    $.validator.unobtrusive.adapters.add(
        &#39;isdateafter&#39;, [&#39;propertytested&#39;, &#39;allowequaldates&#39;], function (options) {
        options.rules[&#39;isdateafter&#39;] = options.params;
        options.messages[&#39;isdateafter&#39;] = options.message;
    });
    $.validator.addMethod(&quot;isdateafter&quot;, function(value, element, params) {
        alert(params.propertytested);
        var startdatevalue = $(&#39;input[name=&quot;&#39; + params.propertytested + &#39;&quot;]&#39;).val();
        if (!value || !startdatevalue) return true;
        return (params.allowequaldates) ? Date.parse(startdatevalue) &lt;= Date.parse(value) : Date.parse(startdatevalue) &lt; Date.parse(value);
    }, &#39;&#39;);

This works fine when the **CalendarEntry** is not wrapped inside another class. HOWEVER, when I use a view model like so:

        public class TrainingDateEditViewModel
        {
            #region Properties
    
            /// &lt;summary&gt;
            /// Gets or sets CalendarEntry.
            /// &lt;/summary&gt;
            public CalendarEntry CalendarEntry { get; set; }
    ....


The client validation no longer works because the html output produced is this:

    &lt;input type=&quot;text&quot; value=&quot;&quot; name=&quot;CalendarEntry.EndDate&quot; id=&quot;CalendarEntry_EndDate&quot; data-val-isdateafter-propertytested=&quot;StartDate&quot; data-val-isdateafter-allowequaldates=&quot;True&quot; data-val-isdateafter=&quot;End date needs to be after start date&quot; data-val=&quot;true&quot;&gt;

And the 

    data-val-isdateafter-propertytested=&quot;StartDate&quot; and IT SHOULD BE: &quot;CalendarEntry.StartDate&quot;.

How would I make it so that it would know to bind to &quot;CalendarEntry.StartDate&quot;
rule.ValidationParameters[&quot;propertytested&quot;] = this.testedPropertyName; // HERE IT SHOULD BE FULL NAME??? HOW??


thanks


MVC custom validation: compare two dates

I have Google checkout sandbox generated HTML code which works fine in HTML page. When I put the same code in XHTML page, it throws the below exception:

&gt; the reference to entity &quot;w&quot; must end with the &#39;;&#39; delimiter

It&#39;s referring the request parameter `w` in the URL in the below `src` attribute:

    &lt;input type=&quot;image&quot; name=&quot;Google Checkout&quot; alt=&quot;Fast checkout through Google&quot;
        src=&quot;http://sandbox.google.com/checkout/buttons/checkout.gif?merchant_id=211512493599623&amp;w=180&amp;h=46&amp;style=white&amp;variant=text&amp;loc=en_US&quot;
        height=&quot;46&quot; width=&quot;180&quot; /&gt;

How is this caused and how can I solve it?


The reference to entity &quot;foo&quot; must end with the &#39;;&#39; delimiter

I have this div element with a background image and I want to stop highlighting on the div element when double-clicking it.  Is there a CSS property for this?

How to stop highlighting of a div element when double-clicking

What is the use of CDATA inside JavaScript tags and HTML?

    &lt;script type=&quot;text/javascript&quot;&gt; 
    // &lt;![CDATA[
    
    // ]]&gt;
    &lt;/script&gt; 


What is CDATA in HTML?

I have this problem, I have two divs:

    &lt;div style=&quot;width:100%; height:50px;&quot; id=&quot;div1&quot;&gt;&lt;/div&gt;
    &lt;div style=&quot;width:100%;&quot; id=&quot;div2&quot;&gt;&lt;/div&gt;

How do I make div2 occupy remaining height of the page?

How to make div occupy remaining height?

In HTML5, do we still need the end slash like in XHTML?

    &lt;img src=&quot;some_image.png&quot; /&gt;

validator.w3.org didn&#39;t complain if I dropped it, not even a warning. But some online documents seem to indicate the end slash is still required for tags such as img, link, meta, br, etc.

Do we still need forward slashes when closing void elements in HTML5?

Is it possible to change the size of an `&lt;li&gt;` element&#39;s *bullet*?

*Take a look at the code below:*

    li {
        list-style: square; // I want to change the size of this squared bullet. 
    }

I can&#39;t seem to find any way to achieve that.

Customize list item bullets using CSS

My webpage has a &#39;skinny&#39; list: for example, a list of 100 items of one word in length each. To reduce scrolling, I want to present this list in two or even four columns on the page. How should I do this with CSS?

&lt;!-- begin snippet: js hide: false --&gt;

&lt;!-- language: lang-html --&gt;

    &lt;ul&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
        &lt;li&gt;Item&lt;/li&gt;
    &lt;/ul&gt;

&lt;!-- end snippet --&gt;

I prefer the solution to be flexible so that if the list grows to 200 items, I don&#39;t have to do a lot of manual adjustments to accommodate the new list.

Is there a way to break a list into columns?

I forgot the jQuery command that will clear all list elements from a list. I did a bit of searching, done it a bunch of times before, but just simply forgot the command.

    $(&quot;ul&quot;).clear()
    $(&quot;ul&quot;).empty()

both didn&#39;t seem to accomplish this.. which command is it again?

UPDATE:  
Thanks guys, I must have some syntax error on my selector.

jQuery remove all list items from an unordered list

I have a list:

    &lt;ul&gt;
        &lt;li&gt;milk&lt;/li&gt;
        &lt;li&gt;butter&lt;/li&gt;
        &lt;li&gt;eggs&lt;/li&gt;
        &lt;li&gt;orange juice&lt;/li&gt;
        &lt;li&gt;bananas&lt;/li&gt;
    &lt;/ul&gt;

Using javascript how can I reorder the list items randomly?

javascript - shuffle HTML list element order

I have the following list:

     &lt;ul id=&quot;otis&quot;&gt;
     &lt;li&gt;Benz&lt;/li&gt;
     &lt;li&gt;Other Benz&lt;/li&gt;
     &lt;li&gt;Other Other Benz&lt;/li&gt;
     &lt;/ul&gt;

I want to get rid the bullets so i tried:

     ul#otis {
     list-style-type: none;
     }

That didn&#39;t work though. What is the proper way to remove the bullets from the displayed list?



Content Type	Original Author	Original Content on Stackoverflow
Question	Manish Basdeo	View Question on Stackoverflow
Solution 1 - Html	Jawad	View Answer on Stackoverflow
Solution 2 - Html	kapa	View Answer on Stackoverflow
Solution 3 - Html	twsaef	View Answer on Stackoverflow
Solution 4 - Html	Adam	View Answer on Stackoverflow
Solution 5 - Html	Jose Faeti	View Answer on Stackoverflow

Can I use a div inside a list item?

Html Problem Overview

Html Solutions

Solution 1 - Html

Solution 2 - Html

Solution 3 - Html

Solution 4 - Html

Solution 5 - Html

Date parsing in javascript is different between safari and chrome

StringIO replacement that works with bytes instead of strings?

Attributions