Div alignment help

[Coach]

How do I get the search class div not to span the length of the menu-bar div? I want it to be 25% of the length and aligned to the right... I also have a CSS file and don't know exactly what needs to be changed their if I want to change the look of the search div since I added that on my own in the index.php file... I am a newbie, but I learn quickly... I am trying to customize a layout and trying to grasp some concepts... Thanks in advance!

<div id="menu-bar">
<div class="wrapper">
<div id="horiz-menu" class="<?php echo $mtype; ?>">
<?php if($mtype != "module") :
echo $mainnav;
else: ?>
<jdoc:include type="modules" name="toolbar" style="none" />
<?php endif; ?>

			</div>

			<?php if ($this->countModules('user7')) : ?>
					<div class="search" align="right">
						<jdoc:include type="modules" name="user7" style="xhtml" />
					</div>
			<?php endif; ?>
		</div>

	</div>

[dagon]

width:25%;
text-align:right

and this is not a php question

[Coach]

Well, where exactly does that go?

It doesn't look like it is in the same syntax as the piece of php from the index.php file that I posted.

[Coach]

What you gave me is CSS syntax and when I put the following in my CSS file it doesn't do anything....

#search {
text-align:right;
width: 25%;
}

[halojoy]

as it is a CLASS, and not id=""
you may want to try:

div.search {
text-align:right;
width: 25%;
}

Sometimes where is several <div> in line
like in a menu-bar, the solution can be
float: right ... or float: left of all menu items divs

See more on float and CSS at
http://www.w3schools.com/css/pr_class_float.asp

regars 🙂

[Coach]

That put it below the menu.div....

Here is my PHP
<div id="menu-bar">
<div class="wrapper">
<div id="horiz-menu" class="<?php echo $mtype; ?>">
<?php if($mtype != "module") :
echo $mainnav;
else: ?>
<jdoc:include type="modules" name="toolbar" style="none" />
<?php endif; ?>

				<?php if ($this->countModules('user7')) : ?>
					<div class="search">
						<jdoc:include type="modules" name="user7" style="xhtml" />
					</div>
			<?php endif; ?>
			</div>


		</div>

	</div>
</div>

=====================================================
And here is my CSS:

div.search {
text-align: right;
width: 25%;
}

=====================================================

I am trying to get my Search div to be right aligned in the wrapper, but with text-align, it moves it below the menu and is left aligned.... when I use float right, it stacks the button under the search box instead of to the right of it.... and I also want to align this to be centered vertically based on the wrapper height, but that can be done with padding I guess....

[Coach]

This is a picture of what is going on right now