JSFiddle - React, Tailwind, and code Playground

HTML

<button class="btn">hello</button>

<button class="dynamic-btn">Dynamic button</button>

JavaScript

var btn = document.querySelector('.btn');

btn.style.position = "fixed";

btn.style.bottom = "100px";

btn.style.right = "100px";



/* here the bottom and right is not fixed - and value 100px is also not fixed
- this values are given user  - a user may select postion to top left, top right, bottom left */ 

/* An example - this are user given values - and based on this values how can i set the positon  */
var position_1 = "top";
var position_2 = "right"

var position_1_value = "100px";
var postion_2_value = "100px";



var dynamic_btn = document.querySelector('.dynamic-btn');

dynamic_btn.style.position = "fixed";

/* dynamic_btn.style.top = position_1_value; */
dynamic_btn.style.position_1 = position_1_value;

/* dynamic_btn.style.right = postion_2_value; */
dynamic_btn.style.position_2 = postion_2_value;