CSS newbie has a few blemishes

Hi All,

I'm starting my first website. It's at http://home.comcast.net/~CaptQueeg/A...ansTables.html.

I can't figure out a couple of things:

1. The text "This site is under ..." doesn't start at the top.

2. The unordered "to-do" list seems to have some sort of border,
despite the fact that I gave it a "border:none" attribute.

Any suggestions gratefully accepted, like "intellectual alms."

Best wishes,
Richard

In article
<1186354661.075078.33380 (AT) d55g2000hsg (DOT) googlegroups.com>,
RichardL <RichardDummyMailbox58407 (AT) USComputerGurus (DOT) com> wrote:

Hi All,

I'm starting my first website. It's at
http://home.comcast.net/~CaptQueeg/A...ansTables.html.

I can't figure out a couple of things:

1. The text "This site is under ..." doesn't start at the top.

2. The unordered "to-do" list seems to have some sort of border,
despite the fact that I gave it a "border:none" attribute.

Any suggestions gratefully accepted, like "intellectual alms."

border:0 needs to be on the li not just the ul

If you add:

#to-do li {border:0;}

to the end of your css, this will remove.

As for the rest, you have made some errors in your css and
deviated from the plan I thought you settled on before? You are
now floating things right and not setting margins...

--
dorayme

On Aug 5, 7:51 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

In article
1186354661.075078.33... (AT) d55g2000hsg (DOT) googlegroups.com>,

RichardL <RichardDummyMailbox58... (AT) USComputerGurus (DOT) com> wrote:
Hi All,

I'm starting my first website. It's at
http://home.comcast.net/~CaptQueeg/A...ansTables.html.

I can't figure out a couple of things:

1. The text "This site is under ..." doesn't start at the top.

2. The unordered "to-do" list seems to have some sort of border,
despite the fact that I gave it a "border:none" attribute.

Any suggestions gratefully accepted, like "intellectual alms."

border:0 needs to be on the li not just the ul

If you add:

#to-do li {border:0;}

to the end of your css, this will remove.

As for the rest, you have made some errors in your css and
deviated from the plan I thought you settled on before? You are
now floating things right and not setting margins...

--
dorayme

Hi dorayme,

Thanks for looking in again at my foibles.

Re: Spurious border lines.
==================
I had #to-do {border:none;}
Why wasn't that good enough. Can't CSS take a hint :-)

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

I tried #to-do {border:0;}
That didn't worked, but it wasn't "li" specific.

So I finally got to what advocated. Whew! And thanks.

Re "deviated from the plan"
Base on my intuition and, I believe, your endorsement, I think tables
is the way to go.

In the meantime, this current course was recommended by a good guy on
the thread, so I thought I should explorer it for my own CSS
education. And education is only gained by making mistakes and
figuring out what's wrong or getting someone or something to point out
what's wrong.

Also, I discovered a website that referenced in comments in
the .html file. So I wanted to see how that guys ideas would work
out.

CSS is a big topic, so merely reading the w3schools, wdg, etc. I did
find an online article on streaming html text and thought I followed
it,
but it didn't work. That's my remaining challenge for today.

I hope you don't think my educational plan is too weird.

Again, thanks for looking into my latest problems.

Best wishes,
Richard

In article
<1186361512.350009.281820 (AT) q75g2000hsh (DOT) googlegroups.com>,
RichardL <RichardDummyMailbox58407 (AT) USComputerGurus (DOT) com> wrote:

On Aug 5, 7:51 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

If you add:

#to-do li {border:0;}

to the end of your css, this will remove the unwanted lines.

As for the rest, you have made some errors in your css and
deviated from the plan I thought you settled on before? You are
now floating things right and not setting margins...

--
dorayme

Hi dorayme,

Thanks for looking in again at my foibles.

Re: Spurious border lines.
==================
I had #to-do {border:none;}
Why wasn't that good enough. Can't CSS take a hint :-)

Because you are telling the element of id "to-do" not to have
borders (in your own way!). You are not telling the list items.

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

Well, the last is no wonder if the first did not work. They are
the same attempt! And neither [1] will do because, as far as I
can see, you are not instructing the list items themselves in
this case.

I tried #to-do {border:0;}
That didn't worked, but it wasn't "li" specific.

So I finally got to what you advocated. Whew! And thanks.

Just always watch out for what it is you are instructing. What
you tell a parent to do does not always go for the kids etc.
(ever dealt with a parent and a teenager?). A ul is different to
the list items in it, it can have borders with or without the
list items having borders.

Re "deviated from the plan"
Base on my intuition and, I believe, your endorsement, I think tables
is the way to go.

Well, that is fine. It will be rock solid, especially for
presenting off line! But I did give you a couple of simple and
reasonably sturdy alternatives in some urls I made for you, using
floats. For what you want, this might do.

------------
[1] I suppose no one wants to know about the identity of
indiscernibles? If any one does, please do not discuss it here as
it has nothing to do with html/css. Go read Leibniz or something.

--
dorayme

On Aug 5, 10:11 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

In article
1186361512.350009.281... (AT) q75g2000hsh (DOT) googlegroups.com>,



RichardL <RichardDummyMailbox58... (AT) USComputerGurus (DOT) com> wrote:
On Aug 5, 7:51 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:
If you add:

#to-do li {border:0;}

to the end of your css, this will remove the unwanted lines.

As for the rest, you have made some errors in your css and
deviated from the plan I thought you settled on before? You are
now floating things right and not setting margins...

--
dorayme

Hi dorayme,

Thanks for looking in again at my foibles.

Re: Spurious border lines.
==================
I had #to-do {border:none;}
Why wasn't that good enough. Can't CSS take a hint :-)

Because you are telling the element of id "to-do" not to have
borders (in your own way!). You are not telling the list items.

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

Well, the last is no wonder if the first did not work. They are
the same attempt! And neither [1] will do because, as far as I
can see, you are not instructing the list items themselves in
this case.

I tried #to-do {border:0;}
That didn't worked, but it wasn't "li" specific.

So I finally got to what you advocated. Whew! And thanks.

Just always watch out for what it is you are instructing. What
you tell a parent to do does not always go for the kids etc.
(ever dealt with a parent and a teenager?). A ul is different to
the list items in it, it can have borders with or without the
list items having borders.

Re "deviated from the plan"
Base on my intuition and, I believe, your endorsement, I think tables
is the way to go.

Well, that is fine. It will be rock solid, especially for
presenting off line! But I did give you a couple of simple and
reasonably sturdy alternatives in some urls I made for you, using
floats. For what you want, this might do.

------------
[1] I suppose no one wants to know about the identity of
indiscernibles? If any one does, please do not discuss it here as
it has nothing to do with html/css. Go read Leibniz or something.

--
dorayme

Hi dorayme,

I had #to-do {border:none;}
Why wasn't that good enough. Can't CSS take a hint :-)

Because you are telling the element of id "to-do" not to have
borders (in your own way!). You are not telling the list items.

That's excellent. That's the kind of stuff I've got to learn. And I
can't learn it by trying to read the CSS standard from "cover to
cover."

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

I tried #to-do {border:none; border:0;}
That didn't work. Weird.

Well, the last is no wonder if the first did not work.

But the strange thing I discovered is that while
#to-do li {borders:0} works
#to-do li {borders:0} doesn't.

Just always watch out for what it is you are instructing. What
you tell a parent to do does not always go for the kids etc.
(ever dealt with a parent and a teenager?).

Yes: Both my daughter and son are parents, and one of them has a
couple of teenagers. And I deal with all of them a lot.

A ul is different to
the list items in it, it can have borders with or without the
list items having borders.

The idea has finally filtered into my reptilian brain.

But I did give you a couple of simple and
reasonably sturdy alternatives in some urls I made for you, using
floats. For what you want, this might do.

I agree. But as I said previously, I think, my foremost goal now is
to become proficient in CSS. And this project is secondary. I've now
concluded that the hit-or-miss approach I've taken so far is
amateurish. So I've scoured the Web for tutorials and reference
material on this topic. I'm going to go through them without bothering
the rest of the world with my ignorance.

I very much appreciate what you and others have done for me. Let's
see what
-- http://css.maxdesign.com.au/floatutorial/index.htm
-- http://www.tizag.com/cssT/background.php
-- http://www.cssplay.co.uk/
et al can do for me.

Best wishes,
Richard

RichardL wrote:

But the strange thing I discovered is that while
#to-do li {borders:0} works
#to-do li {borders:0} doesn't.

Neither should. The syntax is { border: 0 } that's border without an 's'.

You were getting a border because you specifically instructed LIs to
have one in your CSS above that rule...

li{border-top:2px solid #eee;}

next you where only trying to clear the border on the *parent* UL with

#to-do {border:0} and border propery is *not* inherited. See:

http://www.w3.org/TR/CSS21/box.html#propdef-border

you *must* specify the LI in question

#to-do li { border: 0; }

BTW the erroneous '-' at the end of your stylesheet throws a syntax error.



--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

On Aug 6, 3:46 pm, "Jonathan N. Little" <lws4... (AT) centralva (DOT) net> wrote:

RichardL wrote:
But the strange thing I discovered is that while
#to-do li {borders:0} works
#to-do li {borders:0} doesn't.

Neither should. The syntax is { border: 0 } that's border without an 's'.

You were getting a border because you specifically instructed LIs to
have one in your CSS above that rule...

li{border-top:2px solid #eee;}

next you where only trying to clear the border on the *parent* UL with

#to-do {border:0} and border propery is *not* inherited. See:

http://www.w3.org/TR/CSS21/box.html#propdef-border

you *must* specify the LI in question

#to-do li { border: 0; }

BTW the erroneous '-' at the end of your stylesheet throws a syntax error.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com

Hi Jonathan,

Great analysis and explanation!

But the strange thing I discovered is that while
#to-do li {borders:0} works
#to-do li {borders:0} doesn't.

Neither should. The syntax is { border: 0 } that's border without an 's'.

I must have been too sleepy when I posted that. What I meant to say
is:
#to-do li {border:0} works
#to-do li {border:none} doesn't.

The latter statement is still true. But your comments made me realize
that the latter statement would work if I prefixed
li{border-top:2px solid #eee;}
with #nav

I still think the CSS implementation is a little flaky: If you
declare border:none, then common sense suggests that all the
descending border attributes should be nullified with respect to the
current tag. Nevertheless, I'm happy to learn how I should code stuff
like this.

BTW the erroneous '-' ,,,

Of course, I don't know how that "-" crept in there :-( What
interests me is that my copy of Aptana (which is my favorite editor
for html, js, css) didn't make a peep about it. Apparently, I've got
to figure out how its "validation" tab works. I know W3C or somebody
hosts a validation site. I'll start using that if I can't get my
editor to alert me.

Did you happen to notice the cause of the text in the right portion of
the page not beginning at the top? I'll figure it out soon as I go
through the excellent CSS tutorials on the Web.

Again, thanks for your response.

Best wishes,
Richard

In article
<1186417751.015729.278510 (AT) 22g2000hsm (DOT) googlegroups.com>,
RichardL <RichardDummyMailbox58407 (AT) USComputerGurus (DOT) com> wrote:

But the strange thing I discovered is that while
#to-do li {borders:0} works
#to-do li {borders:0} doesn't.

(1) You better read Leibniz on The Identity of Indiscernibles

or

(2) Your newsreader and/or keyboard is playing tricks

or

(3) My newsreader and/or eyesight is playing tricks on me

--
dorayme

On Aug 6, 7:52 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

In article
1186417751.015729.278... (AT) 22g2000hsm (DOT) googlegroups.com>,

RichardL <RichardDummyMailbox58... (AT) USComputerGurus (DOT) com> wrote:
But the strange thing I discovered is that while
#to-do li {borders:0} works
#to-do li {borders:0} doesn't.

(1) You better read Leibniz on The Identity of Indiscernibles

or

(2) Your newsreader and/or keyboard is playing tricks

or

(3) My newsreader and/or eyesight is playing tricks on me

--
dorayme

Hi dorayme,

(1) You better read Leibniz on The Identity of Indiscernibles

I love Leibniz, not for his philosophy, but for re-invention of
something that was invented several millenia earlier by Archimedes and
published in his tome, "My Methods". That "something" was Integral
Calculus.

(2) Your newsreader and/or keyboard is playing tricks

No, it was not the fault of my machine, neither hardware nor
software. All I can say is I think I posted that error-ridden piece
after midnight my time.

Right now I looking at some elementary CSS tutorials like
http://home.comcast.net/~CaptQueeg/6...ft_element.htm,
which I sometimes embellish to state the point of the example more
forcefully IMHO.

I think I'm getting better. I'll keep you posted.

Best wishes,
Richard

On Mon, 06 Aug 2007 18:09:29 -0700, RichardL
<RichardDummyMailbox58407 (AT) USComputerGurus (DOT) com> wrote:

I'll keep you posted.

When you do, please quote what you are responding to just once. Your
interleaved responses are ideal and easy to follow, but preceding that
with the fully quoted message (including signature) is unnecessary.

I am finding this thread to be helpful and hope to remember the advice
given. And it's interesting to observe the interaction between
martian and reptilian.
--

Charles