CODEWITHSUNDEEP
javascripthtmlgoogle-chromepopupgoogle-chrome-extension
Lazer
Lazer

Reputation: 95020

How to restrict the size of a Google chrome extension popup?

I am creating a Google Chrome extension that does some basic search based on the choices provided.

This is how it looks so far

enter image description here

The problem is that there is a lot of white space on the sides which does not look good, especially because this is a popup and overlays on the current page.

How can I make sure that the popup uses the minimum amount of space required?

Upvotes: 0

Views: 6787

Answers (3)

user1158415
user1158415

Reputation:

as nkorth said, this is quite easy, using CSS. Let me write out the code for you:

<html>
  <head>
     <style type="text/css">
         body {
            width: 200px;
            height: 200px;
            overflow: hidden;
         }
     </style>
  </head>
  <body>
     text text text
  </body>
</html>

Upvotes: 5

nkorth
nkorth

Reputation: 1694

It should be as simple as styling the body element. Do you want a fixed size, fixed width, or just less margins? For fixed size, you should use overflow:scroll or overflow:hidden along with the appropriate width and height. For fixed width, use width and optionally min-height. For any of these, you should check the margins on all the block-level elements to see if that's where your whitespace is coming from.

Upvotes: 4

silverfox
silverfox

Reputation: 5272

You can follow Debugging Tutorial to inspect this popup.

Maybe set the min-width property to body element could fix it. If not, please append the html code, we can check it later.

Upvotes: 1

Related Questions