•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the HTML and CSS section within the Web Development category of DaniWeb, a massive community of 392,000 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 4,183 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our HTML and CSS advertiser: Lunarpages Web Hosting
Views: 1272 | Replies: 4
![]() |
•
•
Join Date: Feb 2005
Posts: 427
Reputation:
Rep Power: 4
Solved Threads: 12
Yep, the title is right!
All I want is a method for getting IE to display 2 divs in a row, the l/r to be 200px wide, the center fluid.
The only stipulations are that all three stretch to 100%, (usually easy in IE), and that the HTML order is L C R.....
so floating seems off in this case!
Please assist.... I'm sick to death of non-compliant browsers and far-fetched layouts.... I've got a layout working in NN6+ and MFF 1.1+..... all I need is one for IE, and if I have to use a seperate/different CSS sheet, then stuff it, I will!
All I want is a method for getting IE to display 2 divs in a row, the l/r to be 200px wide, the center fluid.
The only stipulations are that all three stretch to 100%, (usually easy in IE), and that the HTML order is L C R.....
so floating seems off in this case!
Please assist.... I'm sick to death of non-compliant browsers and far-fetched layouts.... I've got a layout working in NN6+ and MFF 1.1+..... all I need is one for IE, and if I have to use a seperate/different CSS sheet, then stuff it, I will!
I'm not quite sure I understand. Does my 3-column layout at www.tgreer.com match your criteria?
•
•
Join Date: Feb 2002
Location: Lawn Guylen, NY
Posts: 10,879
Reputation:
Rep Power: 32
Solved Threads: 107
[html]
<div id="main">
<div id="left" style="float:left; width:200px">
</div>
<div id="right" style="float:right; width:200px">
</div>
<div id="center">
</div>
</div>
[/html]
<div id="main">
<div id="left" style="float:left; width:200px">
</div>
<div id="right" style="float:right; width:200px">
</div>
<div id="center">
</div>
</div>
[/html]
Dani the Computer Science Gal
Do you run a computer-related website? Feature it in our niche link directory!
Do you run a computer-related website? Feature it in our niche link directory!
•
•
Join Date: Feb 2005
Posts: 427
Reputation:
Rep Power: 4
Solved Threads: 12
Sorry, obviously I typed out so fast I failed to put enough details in!
I require a 3 column layout......
*strict xhtml
*header & footer seperate from the content block with the 3 cols.
*each column must stretch vertically to match the longest column.
*the left and right columns need to be of fixed width.
*the central column needs to be fluid.
*the html / source order needs to be Left Center Right
I only need this for IE, as I have a decent copy for other browsers... I just seem unable to get this running right in strict xhtml for IE.
Hope that makes more sense.
I require a 3 column layout......
*strict xhtml
*header & footer seperate from the content block with the 3 cols.
*each column must stretch vertically to match the longest column.
*the left and right columns need to be of fixed width.
*the central column needs to be fluid.
*the html / source order needs to be Left Center Right
I only need this for IE, as I have a decent copy for other browsers... I just seem unable to get this running right in strict xhtml for IE.
Hope that makes more sense.
•
•
Join Date: Mar 2006
Posts: 6
Reputation:
Rep Power: 0
Solved Threads: 0
Does this help you?
The CSS layout:
DianeD
•
•
•
•
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<!-- left column -->
<div id="lh-col"><br />
</div>
<!-- end of left column -->
<!-- center column -->
<div id="c-col">
</div>
<!-- end of center column -->
<!-- right column -->
<div id="rh-col"><br />
</div>
<!-- end of right column -->
</body>
</html>
The CSS layout:
•
•
•
•
body{
margin: 0; padding:0;
background: #808080; color: #333333;
}
#lh-col{
position: absolute;
top: 20px;
left: 20px;
width: 180px;
border: 1px solid #333333;
background: #c0c0c0;
color: #333333;
margin: 0;
padding: 0;
height: 500px;
z-index: 2;
}
#rh-col{
position: absolute;
top: 20px;
right: 20px;
width: 180px;
border: 1px solid #333333;
background: #c0c0c0;
color: #333333;
margin: 0;
padding: 0;
height: 500px;
z-index: 1;
}
#c-col{
position: relative;
margin: 20px 201px 20px 201px;
border: 1px solid #333333;
background: #ffffff;
color: #333333;
padding: 20px;
z-index: 3;
}
DianeD
![]() |
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
•
•
•
•
•
•
•
•
DaniWeb HTML and CSS Marketplace
- how to make animation bar in vb.net (ASP.NET)
- plotting sine curve (C++)
- Www.rapcityz.coM is up for sell (Websites for Sale)
- need help in vc++ programming. (C++)
- help with form/ display issues (ColdFusion)
Other Threads in the HTML and CSS Forum
- Previous Thread: Bookmark function in mozilla firefox
- Next Thread: Populate a textbox



Linear Mode