Menu icon Foundation
how can i change my table responsive

raghavi over 4 years ago

but my table is created by small-block-grid and ul li

Bob Sawyer over 4 years ago

In that case, regardless of how you style it, it's a list, not a table. It might be helpful to see your code, but if it contains data that would be better suited to , then you should consider using < table > and not < ul >.

raghavi over 4 years ago

        <div class="large-12 ">
          <ul class="small-block-grid-10">

            <li class="title">No</li>
            <li class="title"><input type="checkbox" class="left"/>All</li>
            <li class="title">EmpId</li>
            <li class="title">EmpName</li>
            <li class="title">Designation</li>
            <li class="title">Password</li>
            <li class="title">Manager</li>
            <li class="title">MailId</li>
            <li class="title">PhoneNo</li>
            <li class="title">Location</li>
          </ul>
        </div>
        <div class="large-12">
          <ul class="small-block-grid-10 ">
            <li>x</li>
            <li class="select"><input type="checkbox"/></li>
            <li id="empid" >xxxx</li>
            <li id="empname">xxxx</li>
            <li id="empdesign">xxxx</li>
            <li id="passwd">xxxx</li>
            <li id="managername">xxxx</li>
            <li id="email">xxxx</li>
            <li id="phone">xxxx</li>
            <li id="location">xxxx</li>
          </ul>
        </div>

Bob Sawyer over 4 years ago

Yeah, this is tabular data and should be treated as such. Put it in a table. You're not doing yourself any favors by trying to do it otherwise. If you're trying to use a list and design it as a table because web standards say you shouldn't design with tables, understand that this only applies to tables for layout purposes. Tabular data should still be treated as a table.

THEN you can apply the responsive tables script I linked above, and your table will be responsive on smaller screens. :)

raghavi over 4 years ago

thanks bob..i'll try it in table...

Bob Sawyer over 4 years ago

My pleasure! Let me know if I can assist further.