一，效果图。
二，代码。
DOCTYPE html>
<html> <head> <meta charset="utf-8"> <title>CSS Aligntitle> <style> body { margin: 0; padding: 0; } .container { position: relative; width: 100%; } .center { margin: auto; width: 70%; background-color: #b0e0e6; } .right { position: absolute; right: 0px; width: 300px; background-color: #b0e0e6; } .right { float: right; width: 300px; background-color: #b0e0e6; } style> head> <body> <div class="center"> <p>In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since.p> <p>'Whenever you feel like criticizing anyone,' he told me, 'just remember that all the people in this world haven't had the advantages that you've had.'p> div> <p><b>Note: b>Using margin:auto will not work in IE8, unless a !DOCTYPE is declared.p> <div class="right"> <p>In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since.p> <p>'Whenever you feel like criticizing anyone,' he told me, 'just remember that all the people in this world haven't had the advantages that you've had.'p> div> <div class="container"> <div class="right"> <p><b>Note: b>When aligning using the position property, always include the !DOCTYPE declaration! If missing, it can produce strange results in IE browsers.p> div> div> <div class="right"> <p>In my younger and more vulnerable years my father gave me some advice that I've been turning over in my mind ever since.p> <p>'Whenever you feel like criticizing anyone,' he told me, 'just remember that all the people in this world haven't had the advantages that you've had.'