1 Topic by zaher

  • zaher
  • Senior Member
  • Offline
  • From: Syria, Damascus
  • Registered: 2004-02-16
  • Posts: 773

Topic: Convert table to <DIV> CSS

I have tired to make that, with 3 Columns the middle must be variable width fit to the space,

|--Fixed left column size--|--Middle fit to rest of space--|--Fixed right column size--|
.home_leftcol {
    float:left;
    position:relative;
    z-index:10;
    width:140px;
    overflow:hidden;
    }

.home_middlecol {
    float:left;
    position:relative;
    width:100%;
    position:relative;
    z-index:12;
}

.home_rightcol {
    float:left;
    position:relative;
    z-index:11;
    width:230px;
    overflow:hidden;
}

how to make it, i spend 3 day to make it but i was failed.

Thanks.

If your people come crazy, you will not need to your mind any more.
  • Connorhd
  • Connorhd
  • Former PunBB Developer
  • Offline
  • From: Leeds, UK
  • Registered: 2004-06-13
  • Posts: 4,195

Re: Convert table to <DIV> CSS

here is one i did with header and footer (its Gary13579s site) http://dragonfighter.gary13579.info/cms.php

FluxBB.
Connorhd.co.uk.

Connorhd's Website

  • From: The Netherlands
  • Registered: 2004-02-21
  • Posts: 65

Re: Convert table to <DIV> CSS

.home_leftcol {
    width: 140px;
    position: absolute;
    left: 0;
    top: 0;
}
.home_middlecol {
    margin: 0 140px;
}
.home_rightcol {
    width: 140px;
    position: absolute;
    right: 0;
    top: 0;
}
  • Connorhd
  • Connorhd
  • Former PunBB Developer
  • Offline
  • From: Leeds, UK
  • Registered: 2004-06-13
  • Posts: 4,195

Re: Convert table to <DIV> CSS

mine is better since its not absolute so you can have a footer tongue

FluxBB.
Connorhd.co.uk.

Connorhd's Website

5 Reply by zaher

  • zaher
  • Senior Member
  • Offline
  • From: Syria, Damascus
  • Registered: 2004-02-16
  • Posts: 773

Re: Convert table to <DIV> CSS

Great big_smile,
i steal css from gary
that worked for me

.home_leftcol {
    float: left;
    width: 150px;
    }

.home_middlecol {
    margin-left: 150px;
    margin-right: 200px;
    padding:0px 10px 0px 10px;
}

.home_rightcol {
    width: 200px;
    float: right;
}

Sander D: your code work when i have no header only, BTW thank for you all.

If your people come crazy, you will not need to your mind any more.