bsherin / tactic

5 stars 1 forks source link

Make right buttons float over codemirror area in console items #1186

Closed bsherin closed 2 months ago

bsherin commented 4 months ago

React Component

import React from 'react';
import './App.css'; // Ensure you import the stylesheet correctly

function App() {
  return (
    <div className="parent-element">
      <div className="content">
        Content goes here, and the button will be positioned above this content.
      </div>
      <button className="float-button">Click Me</button>
    </div>
  );
}

export default App; CSS (App.css)

.parent-element {
  position: relative;  /* Required for absolute positioning of the child */
  width: 300px;        /* Set as per your requirement */
  height: 200px;       /* Set as per your requirement */
  border: 1px solid black; /* For visibility */
}

.float-button {
  position: absolute;
  top: 10px;        /* Adjust the top distance as per your needs */
  right: 10px;      /* Adjust the right distance as per your needs */
}

.content {
  padding: 20px;   /* Providing space for the content */
}
bsherin commented 2 months ago

done