Topic: Can you see anything wrong, or Browser bug?

Hi, guys. I am busy validating my css here:
http://jigsaw.w3.org/css-validator/validator-text.html
It is saying me some error is happening. But I am afraid it seems to me fine.
Do you see anything wrong?
Actually when I open my html file using IE5, white border cannot be shown.
That is my biggest problem. When I hover link, it can be shown. Is this bug?
I don't kwow why?
How about you?

my code is here:

quote:

---

<style type="text/css">
body {
background: #000;
color: #fff;
font-size: small;
font-family: verdana;
}

h1 {
font-size: 95%;
}

.left{
background: #666;
border: solid #fff 1px;
}

A {
color: #fff;
text-decoration: none;
font-weight: bold;
}

A:hover
{
color: #000;
background: #9cf;
}
A.word{
color: #9cf;
}
A.word:hover{
color: #9cf;
background: none;
text-decoration: underline;
}

</style>

---

Hiroki Kozai

[This message has been edited by Hiroki (edited 04-22-2003).]

Actually when I validate, the error message said to me:

quote:

---

Parse error - Unrecognized : <style type="text/css"> body { background: #000; color: #fff; font-size: small; font-family: verdana;

---

Only that....I think it is fine. Even I want to believe it is all right.

Hiroki Kozai

When you use that validator, don't copy the <style..> tags into it - just copy the CSS. Looks like it validates more or less fine.

To fix the border, try changing

border: solid #fff 1px;

to

border: 1px solid #fff;

I'm not sure if the order matters, but that's how I always write it.

Always a moment too slow to beat Slime!

yep - the <style> and </style> tags aren't actually part of the style sheet, so don't paste them into the validator. If you omit them, the validator passes it with just a few warnings, no errors.

Hi, slime.
I changed like you said.

quote:

---

.left{
background: #666;
border: 1px solid #fff;
width: 15%;
padding: 8px;
position: absolute;
top: 13%;
left: 1%;
}

---

It didn't work. Still same problem is happening. When I minimize the screen and resize it, it showing nice white line. But when I click refresh button, it disapper again. Hmm.........Why? Do you have any idea???



Hiroki Kozai

Also I want to believe this code is fine.

quote:

---

.sp {
text-align: center;
text-decoration: underline;
}

.left{
background: #666;
border: 1px solid #fff;
width: 15%;
padding: 8px;
position: absolute;
top: 18%;
left: 1%;
}
----------------------------------------
<div class="left">
<h1 class="sp">Contents</h1>
<a href="1.htm" onMouseOver="window.status='Learn about Operating System'; return true;"

onMouseOut="window.status='';">1.Operating&nbsp;System</a><br />
<a href="2.htm" onMouseOver="window.status='Get Dos Command'; return true;"

onMouseOut="window.status='';">2.Dos&nbsp;Command</a><br />
<a href="3.htm" onMouseOver="window.status='Get Wild Card'; return true;"

onMouseOut="window.status='';">3.Wild&nbsp;Card</a><br />
<a href="4b.htm" onMouseOver="window.status='Make Batch File'; return true;"

onMouseOut="window.status='';">4.Batch&nbsp;File</a><br />
<a href="4.htm" onMouseOver="window.status='Get Linux Command'; return true;"

onMouseOut="window.status='';">5.Linux&nbsp;Command</a><br />

<h1 class="sp">Quick Try</h1>
<a href="2t.htm" onMouseOver="window.status='Test Dos Command'; return

true;"onMouseOut="window.status='';">1.Dos&nbsp;Command</a><br />
<a href="3t.htm" onMouseOver="window.status='Test Wild Card'; return

true;"onMouseOut="window.status='';">2.Wild&nbsp;Card</a><br />
<a href="4bt.htm" onMouseOver="window.status='Make Batch File yourself'; return true;"

onMouseOut="window.status='';">3.Bactch&nbsp;File</a><br />
<a href="4t.htm" onMouseOver="window.status='Test Linux Command'; return true;"

onMouseOut="window.status='';">4.Linux&nbsp;Command</a><br />
</div>

---

But when I refresh page, it hasnot been centered yet. Even, when I hover links, they are sifting position. Do you know what I mean?



Hiroki Kozai

Hmm... for the centering problem, my first bit of advice would be to set the width to 100%. (Otherwise it's just centering within the h1, which doesn't by default span the entire screen.)

As for the border problem... can we have a link to the page?

Here is link:
http://www32.brinkster.com/sanukiudon/kill.htm

and about centering problem...
If I set widht 100%, my left box will interfer against main body box, won't it?
Or do I get your opinion wrong?

Hiroki Kozai

Just set the width of the h1 itself to 100% (in the .sp class CSS thingy). It will make the h1 take up 100% of the space that it has *within the DIV that contains it*.

I'm unable to duplicate this missing border problem. Can anyone else duplicate it? If not, you might need to show a screenshot - although, even then we might not be able to figure out what's wrong. But I see a white border all the way around the left menu area all the time.

Thanks, Slime.
Well, please see here:
http://www32.brinkster.com/sanukiudon/nowhiteline.gif
Look a wee bit small but you can see it without whiteline.
I miss you, white!
Just come to me.....! (> <") !

Hiroki Kozai

Gonna need more detail than that. Why don't you just crop it to the problematic area?

Thanks for your help, Slime.
Now I cannot crop it as I changed room.
I am sorry to disappoint you.
But cannot you see it well?
You can see three boxes in the img.
All has to include white line around them.
But I could see none of them did from that img.
Still need crop image? That is what I have been meaning.
Many many thanks to you.
I am off to home soon.
Have a good night.


Hiroki Kozai

Hi, guys. Good morning from New Zealand.
This morning, I helped my family pick up grapes.
It was my first experience to do so. Great.

Well, I just wanted to say that my problem of white line may be caused by IE5 bug.
Because I copy and made another htm file from a web site. Probably bluerobot. com.
When I open that file, still doesn't show line so that I assume it is just bug.
Thanks for your help, Slime.
Today, I will study about positioning relative and absolute.

Cya.

Hiroki Kozai