Through various ways, I tried to make these frames, but it always turns out that each cell lives its own life and only the frames of each cell are rounded off separately. Here you need to do so. enter image description here .

Closed due to the fact that off-topic participants 0xdb , LFC , HamSter , freim , andreymal February 18 at 19:54 .

It seems that this question does not correspond to the subject of the site. Those who voted to close it indicated the following reason:

  • " Learning tasks are allowed as questions only on the condition that you tried to solve them yourself before asking a question . Please edit the question and indicate what caused you difficulties in solving the problem. For example, give the code you wrote, trying to solve the problem "- 0xdb, LFC, HamSter, freim, andreymal
If the question can be reformulated according to the rules set out in the certificate , edit it .

    2 answers 2

    Like this?

    .aaa { display: block; width: 300px; padding: 20px 5px; background: #8b4cff; border-radius: 5px; } .bbb { display: block; width: 100%; height: 50px; border-radius: 5px; background: #1b1824; } .bbb:not(:last-child) { margin-bottom: 10px; } 
     <div class="aaa"> <div class="bbb"></div> <div class="bbb"></div> <div class="bbb"></div> <div class="bbb"></div> <div class="bbb"></div> </div>

      Try this

       <!DOCTYPE html> <html> <head> <title>Title</title> <style type="text/css"> td { width: 400px; height: 80px; background-color: black; border-radius: 20px; color: white; padding-left: 10px; padding-right: 10px; } .ph { width: 60px; height: 60px; background-color: grey; float: left; margin-right: 10px; } .star { width: 20px; height: 20px; background-color: yellow; float: right; } </style> </head> <body bgcolor="black"> <center> <h1 style="color: white;">Электронная библиотека</h1> <div style="background-color: navy; width: 420px; border-radius: 20px; padding: 20px;"> <center> <table> <tr> <td> <div class="ph"></div> <div class="star"></div>Content</td> </tr> <tr> <td> <div class="ph"></div> <div class="star"></div>Content</td> </tr> <tr> <td> <div class="ph"></div> <div class="star"></div>Content</td> </tr> <tr> <td> <div class="ph"></div> <div class="star"></div>Content</td> </tr> </table> </center> </div> </center> </body> </html>

      • one
        and your html css checked for validity? - MaximLensky
      • one
        Tag center , seriously? <body bgcolor="black"> - What kind of echo of the 20th century? - Air
      • Write better, I think it will be more useful to a person than just a comment with a sneer) - Alexander