Two columns in pages

[AndreaMarucci]

I would like to create a page with two columns of text. I know that I could use tables but I would like to know if there's any other way to do that through CSS...

 

[Paul B]

https://www.google.com/#hl=en&cp=7&gs_id=r&xhr=t&q=2 column css&tok=d6gU9Qf_UGTljnwDaf-p2A&pf=p&sclient=psy-ab&safe=off&site=&source=hp&pbx=1&oq=2 colum&aq=0&aqi=g4&aql=&gs_sm=&gs_upl=&bav=on.2,or.r_gc.r_pw.r_cp.,cf.osb&fp=a1bc1589ec616832&biw=1920&bih=965

A simple float condition will achieve that.

 

[AndreaMarucci]

Thanks Brogan. Tried it but everytime I hit reload I get a completely messed up page. Probably there's some css code that conflict with the XF css code... I've tried this (putting the css in extra.css) but the page header disappeared and nothing is displayed in the page...

.pgn_mask{
  position: relative;
  overflow: hidden;
  margin: 0px auto;
  width: 100%;
  background-color: #ffffff
}
.pgn_header{
  float: left;
  width: 100%;
  background-color: #ffffff
}
.pgn_colleft{
  position: relative;
  width: 100%;
  right: 50%;
  background-color: #ffffff
}
.pgn_col1{
  position: relative;
  overflow: hidden;
  float: left;
  width: 48%;
  left: 101%;
  background-color: #ffffff
}
.pgn_col2{
  position: relative;
  overflow: hidden;
  float: left;
  width: 48%;
  left: 3%;
  background-color: #ffffff
}
.pgn_footer{
  float: left;
  width: 100%;
  background-color: #ffffff
}
 
<div class="pgn_mask">
    <div class="pgn_header">
        header
    </div>
    <div class="pgn_colleft">
        <div class="pgn_col1">
            right
        </div>
        <div class="pgn_col2">
            left
        </div>
    </div>
    <div class="pgn_footer">
        footer
    </div>

 

[Paul B]

You're missing a closing </div>.

 

[AndreaMarucci]

I've used tables. It's too frustrating to have to do with css and go on trying just to obtain nothing. I simply do not understand what's going on...