CSS Keep div at a fixed width when minimizing screen

Question

Hello guys have a div that is outside of a table and I want the div to stay the same size when a user minimizes the screen. Here is what its doing:

Basically i want the width to stay at 60% and not shrink when I minimize the page:

CSS:

message_box,

{
background-color:#EEEECC;
border: #CCCCAA thin solid;
margin: 0 auto;
padding: 5px;
text-align: center;
font-family: arial, sans-serif;
font-size: 10pt;
margin-bottom: 10px;
}

html:

<div class="message_box" style="width: 60%">

Answer 1

When you set an element to width:60%, that means that the element will be 60% as wide as its parent element.

If <div class="message_box">’s parent element gets narrower, then <div class="message_box"> will get narrower too.

When you say you want <div class="message_box"> to be 60% wide, what exactly do you mean? 60% of what?

If you’d like <div class="message_box">’s width to be a specific number of pixels, and not change when the user resizes their browser window, you should set its width in pixels, e.g.:

<div class="message_box" style="width: 300px">