Size of div changes from browser to browser?

Question

Pretty simple problem here. Whenever I change browser windows the div on my code changes size. Inside the div is a list of links, in Chrome the div encapsulates all the links perfectly but in something like Firefox or Safari the div stops at about the second to last link. How do I make the div size equal across all browsers?

.test {
  width: 420px;
  height: 2270px;
  border: 1px solid grey;
  top: 50%;
  background-color: whitesmoke;
  position: relative;
  align: center;
}

I'm guessing it has to do with how each browser interprets it, but I'm not exactly sure how to fix that.

Answer 1

Yes you can keep the div size fixed regarding different window size. But It depends on your need. If your div contains texts/image , you can use

overflow:hidden;

Again, Your div is getting so small for the smaller screens and thats your main concern, you can use

min-width: 200px;

In this case, even if the parent div gets smaller, child div will be the same unless the parent div becomes smaller than the child div.