If you need a width other than 300px, lets say 400px, then in the div you override the CSS width definition by adding a width to the div itself.
So a div with an overriding width would look like this.
<div class="center_div" style="width:400px;> Your text here </div>
Browsers will override anything defined in CSS if there is a conflicting value defined right on the object itself.
So for any divs where 300px doesn't work you would have to add that overriding value on the div. It is a lot more work though.
I would be fine to just use an average width and if it wraps funny for some.. oh well, people won't be turned off by it, and shouldn't be confused either.
You could use percent but I think you would have the same result and would need to override it on some pages.
Percent would work like this.
Lets say the <div> is in another div that is set to 800px... using 40% would give you a width of 320px;, but if it is always going in a 800px container then 40% will always be 320px so you have the same problem as no matter if you use width:320px or width:40%