Jak utworzyć strukture w html, aby po kliknięciu w przycisk show zrobić rozwinięcie (to mi działa), a content(lorem ipsum..), żeby się zaczynał jako nowy div, dzięki czemu wyswietlony "lorem ipsum.." będzie się zaczynac od lewej strony jako niezalezny element i zajmował 100% (to mi nie działa). Na chwilę obecną coś skleciłem, ale to nie dziala jak powinno bo, po kliknieciu w show tekst jest tak jakby w 3 kolumnie, a powinien byc pod "lala" i zajmowac 100% czyli konczyc się pod hidden. Mozliwe, ze zle stosuje znacznik details, summary. Jak byscie to zrobili? Staram się to przedstawić w formie tabelki.
https://codepen.io/olivier-mazur/pen/XWYdKVw
0
0
tabsy123 napisał(a):
Jak utworzyć strukture w html, aby po kliknięciu w przycisk show zrobić rozwinięcie (to mi działa), a content(lorem ipsum..), żeby się zaczynał jako nowy div, dzięki czemu wyswietlony "lorem ipsum.." będzie się zaczynac od lewej strony jako niezalezny element i zajmował 100% (to mi nie działa). Na chwilę obecną coś skleciłem, ale to nie dziala jak powinno bo, po kliknieciu w show tekst jest tak jakby w 3 kolumnie, a powinien byc pod "lala" i zajmowac 100% czyli konczyc się pod hidden. Mozliwe, ze zle stosuje znacznik details, summary. Jak byscie to zrobili? Staram się to przedstawić w formie tabelki.
https://codepen.io/olivier-mazur/pen/XWYdKVw
Nie musisz używać <summary> i <details> pod to, możesz po prostu zrobić same <div> i pokazać je w JS'ie.
0
Jeśli skasujesz z klasy .div-table-row właściwość grid-template-rows i rozciągniesz znacznik details przez grid-columns: 1 / -1; to całość powinna się wyświetlić pod spodem tak jak chcesz.