Dreamweaver CSS Help

How do I adjust the width of the navBar?
Here's the code:

<div id="navBar">
<div id="search"><form action="#">
<label>search</label>
<input name="searchFor" type="text" size="17">
<input name="goButton" type="submit" value="go">
</form>
</div>
<div id="SectionLinks">
<h3 class="style22"><strong>The Media Section</strong></h3>
<ul class="style73">
<li><a href="#">Photos</a></li>
<li><a href="#">Videos</a></li>
<li><a href="#">News Articles </a></li>
<li><a href="#">Tail # History </a></li>
<li><a href="#">Guest Book</a></li>
<li><a href="#">Guest Log</a></li>
<li><a href="#">Sound Files</a></li>
</ul>
</div>
<div id="SectionLinks">
<h3 class="style22"><strong>Mission Planning</strong></h3>
<ul class="style73">
<li><a href="#">Weather</a></li>
<li><a href="#">NOTAMS</a></li>
<li><a href="#">Time Hack </a></li>
<li><a href="#">Frag Sheet </a></li>
</ul>
</div>
<div id="SectionLinks">
<h3 class="style22"><strong>Password Protected</strong></h3>
<ul class="style73">
<li><a href="#">Pilot Lineage </a></li>
<li><a href="#">Limits Sheet (M) </a></li>
<li><a href="#">Limits Sheet (J) </a></li>
<li><a href="#">Weight & Balance </a></li>
<li><a href="#">Radar Paper</a></li>
</ul>
</div>
<div class="SectionLinks">
<h3 class="style22"><strong>Admin Section</strong></h3>
<ul class="style73">
<li><a href="#">TDY Center </a></li>
<li><a href="#">PCS Help </a></li>
<li><a href="#">Forms</a></li>
<li><a href="#">Official Sites</a></li>
<li><a href="#"> Unofficial Sites</a></li>
</ul>
</div>

<p><span class="style73">Order your <a href="Media/Pictures/Paveart/Pavedecal.JPG">PaveDecal</a><br>
<img src="Media/Pictures/Paveart/Pavedecal.gif" width="138" height="46"><br>
from here: </span><br>
<a href="http|//www.3dcarfx.com"><img src="Media/Pictures/Misc%20Photos/3dcarfx.JPG" width="150" height="28" border="1"></a></p>
<p class="style6 style74"><em><strong>To order:</strong></em> Since the Pavedecal isn't listed on their website, order any product, then in the remarks section tell them you want to cancel the original order and order the Pave Leads decal instead. This is the only way they can get your credit card info. <span class="style6">$1.00 an inch. </span></p>
</div>
<!--end navBar div -->

 

is all of this meant to be vertical on the sides, or horizontal at the top or bottom?

When I paste your code into Dreamweaver, it is all vertical.

I ask, because I always considered a navbar as a horizontal bar.

anyway, I suppose the easiest thing, to keep everything looking the same would be to introduce table, tr and td tags to beginning and end; specifying width in the table tag.

Personally, i wouldn't have created it all using div and p tags

<table width="200"><tr><td><div id="navBar">
<div id="search"><form action="#">
<label>search</label>
<input name="searchFor" type="text" size="17">
<input name="goButton" type="submit" value="go">
</form>
</div>
<div id="SectionLinks">
<h3 class="style22"><strong>The Media Section</strong></h3>
<ul class="style73">
<li><a href="#">Photos</a></li>
<li><a href="#">Videos</a></li>
<li><a href="#">News Articles </a></li>
<li><a href="#">Tail # History </a></li>
<li><a href="#">Guest Book</a></li>
<li><a href="#">Guest Log</a></li>
<li><a href="#">Sound Files</a></li>
</ul>
</div>
<div id="SectionLinks">
<h3 class="style22"><strong>Mission Planning</strong></h3>
<ul class="style73">
<li><a href="#">Weather</a></li>
<li><a href="#">NOTAMS</a></li>
<li><a href="#">Time Hack </a></li>
<li><a href="#">Frag Sheet </a></li>
</ul>
</div>
<div id="SectionLinks">
<h3 class="style22"><strong>Password Protected</strong></h3>
<ul class="style73">
<li><a href="#">Pilot Lineage </a></li>
<li><a href="#">Limits Sheet (M) </a></li>
<li><a href="#">Limits Sheet (J) </a></li>
<li><a href="#">Weight & Balance </a></li>
<li><a href="#">Radar Paper</a></li>
</ul>
</div>
<div class="SectionLinks">
<h3 class="style22"><strong>Admin Section</strong></h3>
<ul class="style73">
<li><a href="#">TDY Center </a></li>
<li><a href="#">PCS Help </a></li>
<li><a href="#">Forms</a></li>
<li><a href="#">Official Sites</a></li>
<li><a href="#"> Unofficial Sites</a></li>
</ul>
</div>

<p><span class="style73">Order your <a href="Media/Pictures/Paveart/Pavedecal.JPG">PaveDecal</a><br>
<img src="Media/Pictures/Paveart/Pavedecal.gif" width="138" height="46"><br>
from here: </span><br>
<a href="http|//www.3dcarfx.com"><img src="Media/Pictures/Misc%20Photos/3dcarfx.JPG" width="150" height="28" border="1"></a></p>
<p class="style6 style74"><em><strong>To order:</strong></em> Since the Pavedecal isn't listed on their website, order any product, then in the remarks section tell them you want to cancel the original order and order the Pave Leads decal instead. This is the only way they can get your credit card info. <span class="style6">$1.00 an inch. </span></p>
</div>
<!--end navBar div -->
</tr></td></table>

 

you can also set width and height to div tags such as <div align="right" width="100" height ="450"></div>

 

Thanks, I'll give it a try