Sent by Paul Manzotti on 19 January 2005 19:07
Holly Bergevin wrote:
>From: Paul Manzotti [EMAIL-REMOVED]>
>
>
>
>>I want to have a
>>central area that can contain two columns, and I want to be able to span
>>those two columns when needed (in a colspan stylee).
>>
>>but it doesn't work in IE.
>>
>>
>You've run into the Doubled Float-Margin bug[1]. Sorry... ;-)
>
>You can solve the problem by adding {display: inline;} to the following selectors. You can hide the
property/value from other browsers, but it's generally not necessary.
>
>
Cheers for that. Turns out that I also hadn't done my maths correctly,
and it wasn't totally fixed until I got the width numbers to actually
add up.
I have another IE problem with the menu on the page:
<http://www.vinylvulture.co.uk/new/index.php>
The first link in the each sub-section of the menu does not have the
10px margin that the other links have. Any ideas why?
Cheers,
manzo
index.php
--------------------------------
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 STRICT//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Vinyl Vultures</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<!--[if gte IE 5]>
<link rel="stylesheet" href="IE6hack.css" type="text/css" />
<![endif]-->
</head>
<body>
<div id="banner">
<div id="bannerImage">
<a href="index.php">
<img border="0" src="images/title_bar_grey.jpg" width="400"
height="88" alt="Vinyl Vulture Logo" /></a>
</div>
<!-- Atomz Search HTML for Vinyl Vulture -->
<div id="searchForm">
<form action="http://search.atomz.com/search/" method="get">
<p><input size="15" name="sp-q" /></p>
<p><input id="searchBoxSubmit" type="submit" value="Search" /></p>
<input type="hidden" name="sp-a" value="sp1002e716" />
<input type="hidden" name="sp-p" value="all" />
<input type="hidden" name="sp-f" value="ISO-8859-1" />
</form>
</div>
</div>
<div id="menu">
<div id="rollover">
<div id="features">
<a href="">Lounge</a>
more links here
</div>
<div id="siteStuff">
<a href="">Licorice Soul</a>
more links here
</div>
</div>
</div>
<div id="content">
<div id="header">
<img src="images/news_bar.gif" width="571" height="101"
border="0" alt="News" />
<h1>December 2004</h1>
<h2>A site for those of us who measure space and time by vinyl</h2>
</div>
<div id="main">
<p>Bunch of text</p>
</div>
<div id="updates">
<h1 id="update">Updates</h1>
<p>Bunch of text</p>
</div>
</div>
</body>
</html>
--------------------------------
IE6Hack.css
This is the style sheet with the code hack for IE
--------------------------------
html
{
height: 100%;
overflow-y: hidden;
}
body
{
height: 100%;
overflow-y: hidden;
}
div#content
{
height: 100%;
overflow: auto;
margin: 0;
padding: 0;
}
div#menu
{
position: absolute;
}
div#banner
{
position: absolute;
}
--------------------------------
style.css
This is the normal style sheet - I've reduced it to the parts that refer
to the menu
--------------------------------
body
{
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
margin: 0px;
padding: 0px;
width: 100%;
height:100%;
}
div#menu
{
width: 179px;
height: 100%;
position: fixed;
top: 88px;
left:0px;
background-color:#c8c7c7;
z-index: 0;
}
div#menu p
{
margin-top: 10px;
margin-left:10px;
}
div#menu #rollover
{
display: block;
margin-left:10px;
width:169px;
background-color: #c8c7c7;
color: #FFFFFF;
}
div#menu #rollover #features
{
border-style: solid;
border-width:1px;
border-color: #FFFFFF;
margin-bottom: 10px;
border-right-color:#c8c7c7;
}
div#menu #rollover #siteStuff
{
border-style: solid;
border-width:1px;
border-color: #FFFFFF;
margin-bottom: 10px;
border-right-color:#c8c7c7;
}
div#menu #rollover a
{
display: block;
margin-left:10px;
width:154px;
background-color: #c8c7c7;
color: #FFFFFF;
font-weight: bold;
padding: 2px;
text-decoration: none;
}
div#menu #rollover a:hover
{
background-color: #FFFFFF;
color: #000000;
text-decoration: none;
}
--------------------------------
--
No virus found in this outgoing message.
Checked by AVG Anti-Virus.
Version: 7.0.300 / Virus Database: 265.7.0 - Release Date: 17/01/2005
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
