skip to Main Content

I’m making a chrome extension and I have a div element that I want to keep the same size and position no matter what. When a user goes to a web page and clicks (Ctr+Shift+(+ or -)) I want the element to keep its same size and position. Is this possible with javascript, CSS, and HTML. Thanks!

2

Answers


  1. I think what you are looking for can be achieved by viewport units. Example:

    div{
      width:40vw;
      height:40vh;
      background:red;
    }
    <div></div>

    viewport units.
    Example:

    Login or Signup to reply.
  2. The problem is that we cannot see your code or part of it so we can only guess what you really need. But if I guess right then the following code will help you achieve what you want

    Set width using VW and height using VH, that will help you make the width and height be always the same no matter what.

    1 VH or VW means 1% of the device screen width or height. So if you set the following values:

    .nomattetwhat {
    //this will fix the width to 69% of the screen size
    
    width:69vw;min-width:69vw;
    
    // this the height
    height:69vh;min-height:69vh;
    
    // if you want the windows to be a popup or modal or always over the rest of the others use
    z-index:99;
    
    // if you want to adjust the position to be sticky
    
    position:sticky;
    
    // if you want to move it around and on top
    
    position:absolute;
    
    // lastly if you want it to be in the middle of everything, vertically and horizontally centered, just use
    
    display:block;margin:0 auto;
    
    }
    

    I hope this help you in what you need. You can always ask me something here

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search