CSS three-column layout
Question
I'm looking for the best way to accomplish the following layout. I need to accommodate a header and footer of varying size, of which I am not in control. In between those elements, I need to set up a fixed three column layout. The total layout needs to always print on one standard page in landscape mode. If I didn't have to allow for the header/footer, I know I could just use a fixed layout... but I can't. The layout needs to be:
variable height header
div with three fixed width columns
variable height footer
ps sorry, don't yet know the proper way to display this graphically here:(
2 answers
solution1
1 2011-04-28 18:41:45
If you're looking to have text divided into three columns, for a treat, you could try CSS3's columns:
This however, is not supported in older browsers.
solution2
0 2011-04-28 19:40:15
If you want to control how your page prints, use the @page rule, like this:
<html>
<head>
<style type="text/css">
@page
{
size:portrait;
margin:1in;
}
</style>
</head>
<body>...</body>
</html>
More info on @page can be found on the W3C's CSS 2 spec .
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.