Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Patrik Horváth
Patrik Horváth
11,110 Points

CSS responzible Table (FLEX)

Hi i wanna know if there is way make responsible table in Mobile, cause i m unable to find good solution tryed look at codepen but nothing =\

best using FLEX

html 

<section class="main">
        <table class="table-fill">
            <thead>
                <tr>
                    <th>Nahľad</th>
                    <th>Názov anime</th>
                    <th>Rok vydania</th>
                    <th>Preložené</th>
                    <th>Hodnotenie</th>
                    <th>Preklad</th>
                    <th>Jazyk Prekladu</th>
                    <th>Čas na epizódu</th>
                    <th>Stav</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                </tr>
                <tr>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                    <td>ss</td>
                </tr>
            </tbody>
        </table>
    </section>

screen : http://i.epvpimg.com/UIwIeab.png

alt text

1 Answer

Frans Teja
Frans Teja
8,175 Points

Do you mean responsive, from my experience when tables come to mobile. Developers would just make it scrollable horizontally, you can find the code how to do that in stack over flow.

But for the best experience, you can create a <select> <option> through html, and code the event when user choose the <option>. So when user choose the option, the table will of that specific column appears on mobile. I hope you get what I mean.

Then create with your own innovation that can make user experience as easy as possible. Because table is really hard to be implemented on mobile.

Thanks I hope my answer helps your project.

Patrik Horváth
Patrik Horváth
11,110 Points

thanx for help :) already fiexed by scroll X overflow