JSFiddle - React, Tailwind, and code Playground

HTML

<div class="selectDisable">
  <h3>
    Me NO selectable
  </h3>
  <p> content </p>
  <p> content </p>
  <p> content </p>
  <p> content </p>
  <p> Try and start dragging from here down wards </p>
  <img src="https://via.placeholder.com/150">
  <p> until here and you wont get any selection </p>
</div>

<hr>

<div class="">
  <h3>
    Me IS selectable
  </h3>
  <p> content </p>
  <p> content </p>
  <p> content </p>
  <p> content </p>
  <p> Try and start dragging from here down wards </p>
  <img src="https://via.placeholder.com/150">
  <p> and the text and image will be highlighted (selected) </p>
</div>

CSS

.selectDisable {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}