0

this is my example I need to implement a method in which it will be possible to allocate from 1 to 4 cells either horizontally or vertically Can anybody helps me?)

I was looking this question but i dont understant how can i improve it to my example:)

.custom {
  display: table;
  margin: 15% auto 15% auto;
  width: 75%;
  max-height: 75%;
  background-color: aqua;
  border: 4px double black;
}
.custom-cell {
  position: relative;
  width: 25%;
  float: left;
  height: 25%;
  padding-bottom: 25%;
  background: radial-gradient(red, black)
}
.custom-cell-clicked {
  position: relative;
  width: 25%;
  float: left;
  height: 25%;
  padding-bottom: 25%;
  background: radial-gradient(black, red)
}
<div class="custom">
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
  <div class="custom-cell"></div>
</div>
Community
  • 1
  • 1
intacto27
  • 9
  • 1
  • Do you want to select one to four items from your divs? – Nikita Sep 10 '16 at 18:54
  • 1
    Implementing the logic from the other question is straightforward enough: https://jsfiddle.net/vrtnw5xf/1/. It's restricting the selection to 4 cells in a horizontal/vertical direction that's tricky. – Rory McCrossan Sep 10 '16 at 19:02

0 Answers0