How to leave boxes next to each other with CSS without inline-block

Asked

Viewed 93 times

2

I’m in a quandary. I want 8 boxes to be next to each other with CSS without using the display: inline-block because I got it with this property but it is not accepted in the pdf that is used in my work.

I’ll leave a photo of how it has to look. I really appreciate if you can help me!! inserir a descrição da imagem aqui

css css3

  • What is the lib, I ask because sometimes you can do with SVG or Canvas but without knowing what the lib does not to say if it is possible.

1 answer

0

Hello, I believe a display: flex

div.allBox {
  display: flex;
  width: 100%;
}

div.box{
  width: 15%;
  background-color: #ccc;
  margin: 5px;
}
<div class="allBox">
  <div class="box">1</div>
  <div class="box">1</div>
  <div class="box">1</div>
  <div class="box">1</div>
  <div class="box">1</div>
  <div class="box">1</div>
  <div class="box">1</div>
  <div class="box">1</div>
</div>

  • 1

    If PDF lib does not support inline-block I find it hard to bear flex... I think that answer was a long shot. xD

  • I don’t have much knowledge about the "supports", I only answered because I know the flex that does the same thing. I apologize if it was "shot in the dark", I really don’t understand about the compatibilities

  • No need to apologize, you did nothing wrong. : ) I think the answer is valid, but also think very likely that the flex will not be supported (since inline-block is not). However, if you want, leave the answer and we’ll see if it helps the author of the question.

  • Yeah, I don’t know if it’s gonna be supported either but I’m gonna test for sure and tell you!

  • It really wasn’t compatible people :(

Browser other questions tagged css css3

You are not signed in. Login or sign up in order to post.