I'm having trouble floating elements left and right. You can see what I want to float left and right here. You can see which elements I want left and right in the header.

This is using a plugin, but still can be styled like HTML. Here is some relevant HTML:

<div>
<h2>Appetizers Left</h2>
</div>
[tbl width="425" colwidth="50|50" colalign="left|right"]
Onion Rings,4.95
Fries,3.99
Nachos Supreme (small),8.95
Nachos Supreme (large),10.95
[/tbl]
<div>
<h2>Fresh Salads Right</h2>
</div>
[tbl width="425" colwidth="100|50|50" colalign="left|right|right"]
,Small,Large
Garden Salad,4.95,5.99
Chef | Caesar| Greek,5.95,6.95
Add chicken for,,2.00
[/tbl]

2

3 Answers

You could wrap each header and associated table in a div like so and apply the floats to that container.

HTML

<div> <div> <h2>Appetizers Left</h2> </div> [tbl width="425" colwidth="50|50" colalign="left|right"] Onion Rings,4.95 Fries,3.99 Nachos Supreme (small),8.95 Nachos Supreme (large),10.95 [/tbl]
</div>
<div> <div> <h2>Fresh Salads Right</h2> </div> [tbl width="425" colwidth="100|50|50" colalign="left|right|right"] ,Small,Large Garden Salad,4.95,5.99 Chef | Caesar| Greek,5.95,6.95 Add chicken for,,2.00 [/tbl]
</div>

CSS

.menu-container.left { float: left; }
.menu-container.right { float: right; }

You need wrappers around your relevant sections
<div>
<div>
<h2>Appetizers Left</h2>
</div>
[tbl width="425" colwidth="50|50" colalign="left|right"]
Onion Rings,4.95
Fries,3.99
Nachos Supreme (small),8.95
Nachos Supreme (large),10.95
[/tbl]
</div>
<div>
<div>
<h2>Fresh Salads Right</h2>
</div>
[tbl width="425" colwidth="100|50|50" colalign="left|right|right"]
,Small,Large
Garden Salad,4.95,5.99
Chef | Caesar| Greek,5.95,6.95
Add chicken for,,2.00
[/tbl]
</div>
<div></div>

The relevant styles in your css styles.

.leftFloat{ float:left; }
.rightFloat{ float:right; }
.clear{ clear:both; }

Read more about floating elements here:

You have to put all your content inside of a div and to use according that you need.

<div>
<div>
<h2>Appetizers Left</h2>
</div>
[tbl width="425" colwidth="50|50" colalign="left|right"]
Onion Rings,4.95
Fries,3.99
Nachos Supreme (small),8.95
Nachos Supreme (large),10.95
[/tbl]
</div>
<div>
<div>
<h2>Fresh Salads Right</h2>
</div>
[tbl width="425" colwidth="100|50|50" colalign="left|right|right"]
,Small,Large
Garden Salad,4.95,5.99
Chef | Caesar| Greek,5.95,6.95
Add chicken for,,2.00
[/tbl]
</div>

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password Submit

Post as a guest

Post Your Answer Discard

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy