Hello to all forum members,
I can't solve this strange behaviour of IE6 (win); I need to make one row of 90x40px buttons with one of them divided horizontally in two mini-buttons of 90x20px.
This is the screenshots as it should be (safari/mac):
And this is IE6/win:
i've prepared a simple html and css test to illustrate it:
HTML: - <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-
-
<html xmlns="http://www.w3.org/1999/xhtml">
-
<head>
-
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
-
<title>test</title>
-
<link rel="stylesheet" type="text/css" href="test.css" media="all" />
-
</head>
-
<body>
-
<ul id="masthead">
-
<li><a class="but1" href="#"></a></li>
-
<ul id="masthead2">
-
<li><a class="but2a" href="#"></a></li>
-
<li><a class="but2b" href="#"></a></li>
-
</ul>
-
<li><a class="but3" href="#"></a></li>
-
</ul>
-
</body>
-
</html>
CSS (I've omitted all the css-reset rules that came before): - ul#masthead {
-
width: 270px;
-
-
}
-
-
#masthead li {
-
float: left;
-
-
}
-
-
#masthead li a.but1 {
-
width: 90px;
-
height: 40px;
-
display: block;
-
background-color: yellow;
-
}
-
-
ul#masthead2 {
-
width: 90px;
-
float: left;
-
}
-
-
#masthead2 li a.but2a {
-
width: 90px;
-
height: 20px;
-
display: block;
-
background-color: blue;
-
}
-
-
#masthead2 li a.but2b {
-
width: 90px;
-
height: 20px;
-
display: block;
-
background-color: red;
-
}
-
-
#masthead li a.but3 {
-
width: 90px;
-
height: 40px;
-
display: block;
-
background-color: green;
-
}
-
-
I've searched a lot and examined the peekaboo bus as described in positioniseverything.net. But there should be something that i can't get.
Can you help me?
Thanks in advance
Alex - Italy
5 1474
Try adding this: Thanks,
{\_/}
(' . ')
(")[DEATH](")
(")(")
IE likes to insert margin where there is none. Your items add up to 270px which is the width of hte container so IE will screw up whatever it can and that's it. See if you can adjust the width a few px to fix it.
Well, forget that. It's not the problem. I'll have to look again later.
btw, Not everyone knows what "css reset" is so you need to include that for them.
I've tried adding:
and also to expand the container masthead width to 500px, but it doesn't work..
btw, Not everyone knows what "css reset" is so you need to include that for them.
And this is the remaining css resetting rules: - /* @group Reset */
-
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
-
margin:0;
-
padding:0;
-
}
-
table {
-
border-collapse:collapse;
-
border-spacing:0;
-
}
-
fieldset,img {
-
border:0;
-
}
-
address,caption,cite,code,dfn,em,strong,th,var {
-
font-style:normal;
-
font-weight:normal;
-
}
-
ol,ul {
-
list-style:none;
-
}
-
caption,th {
-
text-align:left;
-
}
-
h1,h2,h3,h4,h5,h6 {
-
font-size:100%;
-
font-weight:normal;
-
}
-
q:before,q:after {
-
content:'';
-
}
-
abbr,acronym { border:0;
-
}
-
-
/* @end */
I also start thinking that it is not the peekaboo bug..
I also start thinking that it is not the peekaboo bug..
It's not related to css.. The cause seems to be the charset definition; i'm making some tests..
Sign in to post your reply or Sign up for a free account.
Similar topics
by: Carriage Return |
last post by:
Hi, I posted earlier because my content was disappearing on IE6, and was
pointed towards the peekaboo bug site,
http://www.positioniseverything.net/explorer/peekaboo.html
I used the 'position:...
|
by: Frostillicus |
last post by:
I've created a page that will contain a the thumbnails of photos I took in
Beijing a couple of years back but since making each thumbnail <div> a
float: left the <h1> tag in the document...
|
by: Barry Pearson |
last post by:
I'm posting here because this is associated with the behaviour of a floated
element. It has similarities to the IE 6 (on Windows) "peekaboo" bug, and I
suspect was written by the same coder having...
|
by: Alex Bell |
last post by:
Please look at the page
http://www.members.iinet.net.au/~abell1/test/leaders.htm whose css
file is city.css in the same directory.
The page has a header, a left fixed and floated navigation div,...
|
by: Niels |
last post by:
Hi group,
I have some problems with clearing floated divs. My usual method works fine in Konqueror, but not in Firefox. Here's an example:
<html><body>
<div id='left' style='float:left;...
|
by: Tom |
last post by:
Has anyone ever seen a IComparer for floats the returns magnitude.
i.e. instead of returning -1, it would return -5. To let you know HOW
different the two numbers are. obviously for int it is a -...
|
by: Daz |
last post by:
Hello hello!
I'm trying to finish off putting my design into HTML and I've come
across a problem that I can't get my head around.
I've got divs floating in two columns, but I'm having problems...
|
by: sbalko |
last post by:
Hi,
I am trying to read Java-floats (IEEE 754 encoding) stored in a binary
file from C (gcc on linux/i386, more specifically). Unfortunately, C
seems to expect floats to be stored somewhat...
|
by: donpro |
last post by:
https://testbed.odysseyshipping.com/index.php
This is driving me nuts. I've spent much time trying to style this
page footer but because I cannot set widths using "display: inline".
I've tried...
|
by: CloudSolutions |
last post by:
Introduction:
For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
|
by: ryjfgjl |
last post by:
In our work, we often need to import Excel data into databases (such as MySQL, SQL Server, Oracle) for data analysis and processing. Usually, we use database tools like Navicat or the Excel import...
|
by: taylorcarr |
last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: aa123db |
last post by:
Variable and constants
Use var or let for variables and const fror constants.
Var foo ='bar';
Let foo ='bar';const baz ='bar';
Functions
function $name$ ($parameters$) {
}
...
|
by: ryjfgjl |
last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
|
by: nemocccc |
last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
| |