Make an element as wide as the grandparent

后端 未结 6 1321
猫巷女王i
猫巷女王i 2020-12-17 21:59

I have the following markup where #content is 80% wide and contains .slide elements. I want the slides to be as wide as their grandparent (i.e. bod

6条回答
  •  死守一世寂寞
    2020-12-17 22:08

    Try using this:

    body {
      margin: 0;
      font: medium monospace;
      background: lightgray;
      overflow: hidden;
    }
    #content {
      margin: auto;
      width: 80%;
      background: white;
    }
    #content:before,
    #content:after {
      content: "";
      display: table;
    }
    .slide {
      height: 6em;
      background: indianred;
      width: 100vw;
      transform: translateX(-10%);
    }

    Lorem ipsum dolor sit amet, consectetur adipiscing elit.

    Phasellus euismod dolor imperdiet!

    Donec mauris tellus

    Pellentesque sit amet venenatis diam, at interdum tortor.

    • Quisque ornare mi in pharetra porttitor.
    • Nulla ultrices quam nec vehicula porta.

提交回复
热议问题