Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design Fullwidth tabs

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #261385
    isendersms
    Participant

    I’m using this tabs:
    https://codepen.io/artlawry/pen/aKbBf

    There is any simple to make the tabs Fullwidth?

    #261386
    Beverleyh
    Participant

    How do you mean?

    1- Make the .tab elements all go the full width of the screen?

    Us can try manipulating the width property and set it to 100%.

    2- Make the three .tab elements take up a third of the screen each so that they collectively span the full width of the screen?

    Try flexbox. Make their parent container a flex item and the use flex-grow on the .tab elements to distribute them evenly along the row. You can learn more about flexbox here https://css-tricks.com/snippets/css/a-guide-to-flexbox/

    For a refresher on web basics, try http://learnlayout.com/

    #261390
    isendersms
    Participant

    Thanks for your answer.
    I tried it already, but it can’t see any change as i want.
    I want it look in the screenshot below:
    https://photos.app.goo.gl/L85ew0HW79PWAjbP2

    #261391
    Beverleyh
    Participant

    Then your answer lies with flexbox and the article I already linked to; see justify-content

    #261396
    isendersms
    Participant

    working, thanks!!!

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘Design’ is closed to new topics and replies.