Columnizing UL creates invalid markup

[jarbot]

From http://www.w3.org/TR/html-markup/ul.html:
UL - Permitted contents: Zero or more li elements

When I columnize the following:

<ul>
    <li>one</li>
    <li>two</li>
</ul>

Result in something like:

<ul>
    <div>
        <li>one</li>
    </div>
    <div>
        <li>two</li>
    </div>
</ul>

I wouldn't really care except that when this is in a form and the user happens to be in IE8 preselected options in selects no longer function.

I thought it would be nice if the plugin would detect that it is dealing with a ul or ol and add an li and nested ul. This may cause style issues for some so I'm not sure if there is a good solution.

[adamwulf]

I just uploaded a sample HTML file with a columnized

element, but I don't see the issue you're describing when columnized - I'm using Chrome for this quick test. do you have URL / example to repro?

[jarbot]

Here's an example of what I'm referring to:

http://jsfiddle.net/pWEU8/

[adamwulf]

Here's the fix: http://jsfiddle.net/pWEU8/1/

The issue is that columnizer should be called on the container of the content - not the content itself. calling columnize() on the parent of the <ul> does the trick.

[jarbot]

That fixed it. Thank you for your time and your awesome plugin :)

[matthew-dean]

What if the parent of the <ul> includes other elements that I don't want divided into columns, and changing the markup is not a possibility? I really only want to subdivide the <li>'s into columns, but would be wrapping them with <ul> instead of <div>. Can that be a code change?

[adamwulf]

Before columnizing, you can use jQuery addClass() on the parent of the UL
to add the "dontsplit" css class. This will prevent the parent of the UL
(and by extension, all its contents) from being split and divided among the
columns. it'll make sure the entire object is put into a single column and
not split.

it sounds like that's what you're aiming for?

On Mon, Sep 15, 2014 at 1:11 PM, Matthew Dean notifications@github.com
wrote:

What if the parent of the

includes other elements that I don't want divided into columns, and
editing the markup is not a possibility?

—
Reply to this email directly or view it on GitHub
#126 (comment)
.