How to Combine CSS "Float Left" and "Float Right"
The CSS "float" property controls where an element displays on the browser. To combine the left and right float properties, you must separate elements into separate div containers. You then program the containers with each float property. This technique forces one element to display on the right and the other element to display on the left of the browser.
Instructions
-
-
1
Right-click the HTML page that contains the elements you want to display. Click "Open With" and select your preferred HTML editor.
-
2
Add the div container code to each element you want to align. The following code is the example of a div container that holds an image:
<div id="alignleft"><img src='image.jpg'></div>
-
-
3
Add the float properties to each div container. The following code is an example of two div containers with the left and right float property set:
<div id="alignleft" style="float:left"><img src='image.jpg'></div>
<div id="alignright" style="float:right"><img src='image.jpg'></div>
-
1