CSS puts in extra space ... why?

On Aug 2, 12:33 am, dorayme <doraymeRidT....DeleteThis@optusnet.com.au> wrote:
> In article
> <1186026420.586605.273....DeleteThis@g4g2000hsf.googlegroups.com>,
>
> RichardL <RichardDummyMailbox58....DeleteThis@USComputerGurus.com> wrote:
> > Hi All,
>
> > I'm planning to create a set of Web pages to present a seminar.
> > Essentially, I intend to present two columns: an accordion menu and a
> > display pane for a selected item. Below is simple code to illustrate
> > my "spacing problem," which is that the menu has an excessive left
> > margin. I can't figure out why. Any suggestions for changes or
> > references to relevant documentation would be greatly appreciated.
>
> > Following are two files to display my problem.
>
> Your
>
> ...8859-1" />
>
> is wrong. Just leave at
>
> 8859-1">
>
> And then start on your problem by adding to your ul:
>
> ul{list-style-type:none;margin:0;padding:0;}
>
> You can now add what suits you. You can also forget about
> dimensioning for width seeing as you are using a table. The magic
> of tables is such that it will adjust to the content. Just keep
> an eye out on you content itself.
>
> For this sort of layout you can also very successfully simply use
> a list floated left, given a width, I tend to give em based
> widths but there is an argument for px too, also %, and then with
> the static right content you give a left margin for the float to
> sit in.
>
> Bare bones, like so:
>
> <ul id="nav">
> <li>...</li>
> <li>...</li>
> </ul>
>
> <div id="content">...</div>
>
> with
>
> #nav {width: 9em; float: left}
>
> #content {margin-left: 11em;}
>
> --
> dorayme

Hi DoRayMe,

(I loved "The Sound of Music", as I assume you did, and I loved
Julie Andrews in every movie she starred in.)

Thanks for explicit suggestions. I'm going to implement them and will
post back.

Best wishes,
Richard

On Thu, 02 Aug 2007 05:47:00 +0200, RichardL
<RichardDummyMailbox58407 DeleteThis @USComputerGurus.com> wrote:

> Hi All,
>
> I'm planning to create a set of Web pages to present a seminar.
> Essentially, I intend to present two columns: an accordion menu and a
> display pane for a selected item. Below is simple code to illustrate
> my "spacing problem," which is that the menu has an excessive left
> margin. I can't figure out why. Any suggestions for changes or
> references to relevant documentation would be greatly appreciated.
>
> Following are two files to display my problem.

Please, please, give an url instead of some code we have to copy/paste,
set in a directory, etc. to make it more accessable. Saving people who
might give you an answer time and effort will make it more likely they
will give you an answer.

To the point: you have not set any left-margin or left-padding on the
body, the table, the td, the ul, and the li. It all adds up, just default
'browser stylesheet', i.e.: their 'normal behaviour if nothing else is
set'. Don't want it? Set it to what you want explicitly.

Why is this in a table BTW? Doesn't make sense to me.
--
Rik Wasmus

On Aug 2, 12:33 am, dorayme <doraymeRidT....TakeThisOut@optusnet.com.au> wrote:
> In article
> <1186026420.586605.273....TakeThisOut@g4g2000hsf.googlegroups.com>,
>
> RichardL <RichardDummyMailbox58....TakeThisOut@USComputerGurus.com> wrote:
> > Hi All,
>
> > I'm planning to create a set of Web pages to present a seminar.
> > Essentially, I intend to present two columns: an accordion menu and a
> > display pane for a selected item. Below is simple code to illustrate
> > my "spacing problem," which is that the menu has an excessive left
> > margin. I can't figure out why. Any suggestions for changes or
> > references to relevant documentation would be greatly appreciated.
>
> > Following are two files to display my problem.
>
> Your
>
> ...8859-1" />
>
> is wrong. Just leave at
>
> 8859-1">
>
> And then start on your problem by adding to your ul:
>
> ul{list-style-type:none;margin:0;padding:0;}
>
> You can now add what suits you. You can also forget about
> dimensioning for width seeing as you are using a table. The magic
> of tables is such that it will adjust to the content. Just keep
> an eye out on you content itself.
>
> For this sort of layout you can also very successfully simply use
> a list floated left, given a width, I tend to give em based
> widths but there is an argument for px too, also %, and then with
> the static right content you give a left margin for the float to
> sit in.
>
> Bare bones, like so:
>
> <ul id="nav">
> <li>...</li>
> <li>...</li>
> </ul>
>
> <div id="content">...</div>
>
> with
>
> #nav {width: 9em; float: left}
>
> #content {margin-left: 11em;}
>
> --
> dorayme

Hi again,

Great advice. Below is my attempt to follow it. I have just three
problems with it.

1. The menu is not left justified.
2. Background-color is not honored, though I've got it working in my
real code (which, BTW, generates the menu from an array of arrays by
stuffing it into the UL's innerhtml)
3. The content appears to be affected by the text present in the menu,
i.e. the first two content lines are indented.

If you have any further guidance, I'd be grateful to receive it.

My test code is presented below. I explained my personal-web-space
problem to Beauregard above, but I'll try to get that resolved soon.
In the meantime, I hope folks will tolerate me pasting code snippets.

Best wishes,
Richard

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/
TR/html4/strict.dtd">
<html>
<head>
<title>Test Style</title>
</head>

<body>
<ul id="nav" style="list-style-type:none; width: 9em; float: left"
background-color:#00FF00;>
<li>AAA</li>
<li>BBB</li>
</ul>

<div id="content" style="margin-left: 11em;">
Labitur lucilius repudiandae quo ex. Petentium interesset
sadipscing vel ut,
platonem imperdiet eam eu, usu et inermis accusam. No sit prima
utinam eirmod.
Eum prima semper te. Id idque blandit sea, mel augue tincidunt ex,
magna mundi
aliquip per et.<p>

Pro error epicuri voluptaria no, vulputate sadipscing pro ut.
Noluisse indoctum
efficiendi cum eu, ex pro facer deseruisse. Vis legimus petentium
deterruisset cu.
Quo no soluta nostrum elaboraret. Te est rebum salutatus
concludaturque, sumo audire
an his.<p>

Ad vel inani mentitum pertinax, eu corpora phaedrum qui, aeterno
diceret mel ei.
Labore evertitur conceptam per at, an laoreet necessitatibus duo.
Ex sed putent
utroque lobortis, ea movet invidunt qui. Falli habemus suscipit et
sit, facer
assum pri in. Eros voluptua et est, nam ex erat primis accusamus,
legere latine
albucius an sea. Te consulatu euripidis has, odio consequuntur ex
has. Percipit
abhorreant dissentiunt te sea.
</div>
</body>
</html>

In article <1186059563.144614.111050 RemoveThis @l70g2000hse.googlegroups.com>,
RichardL <RichardDummyMailbox58407 RemoveThis @USComputerGurus.com> wrote:
> On Aug 2, 12:24 am, Rik <luiheidsgoe... RemoveThis @hotmail.com> wrote:
[snip]
> > Why is this in a table BTW? Doesn't make sense to me.
> I want a vertical "accordion" menu on the left and a pane on the right
> (destined to be 90% of the page width) on the right, where contents
> referenced by a selected menu choice will be displayed. Is there a
> better way to achieve that?

I _think_ I know what you mean by an "accordian" menu; I just went
with a single menu with 'popup' submenus. You can see the result on
the tutorial site I'm working on here (warning: not all the pages
exist yet!):

http://www.chem.utoronto.ca/coursenotes/analsci/stats/

If you look in the 'copyright' section, there's a link to the site
I got the layout and menu system from. The two/three column layout
css is a little complex (there's a simpler version called Skidoo Lite)
but it allows all the columns to effectively be the same height.

Semantically, a table is inappropriate since a tutorial with navigation
menu and content is not tabular data. If you want to use a table for
layout purposes that's your choice, but at least google past postings
in this group and comp.infosystems.www.authoring.html to find out what
the issues are first!

In article
<1186026420.586605.273570.RemoveThis@g4g2000hsf.googlegroups.com>,
RichardL <RichardDummyMailbox58407.RemoveThis@USComputerGurus.com> wrote:

> Hi All,
>
> I'm planning to create a set of Web pages to present a seminar.
> Essentially, I intend to present two columns: an accordion menu and a
> display pane for a selected item. Below is simple code to illustrate
> my "spacing problem," which is that the menu has an excessive left
> margin. I can't figure out why. Any suggestions for changes or
> references to relevant documentation would be greatly appreciated.
>
> Following are two files to display my problem.
>

Your

....8859-1" />

is wrong. Just leave at

8859-1">

And then start on your problem by adding to your ul:

ul{list-style-type:none;margin:0;padding:0;}

You can now add what suits you. You can also forget about
dimensioning for width seeing as you are using a table. The magic
of tables is such that it will adjust to the content. Just keep
an eye out on you content itself.

For this sort of layout you can also very successfully simply use
a list floated left, given a width, I tend to give em based
widths but there is an argument for px too, also %, and then with
the static right content you give a left margin for the float to
sit in.

Bare bones, like so:

<ul id="nav">
<li>...</li>
<li>...</li>
</ul>


<div id="content">...</div>

with

#nav {width: 9em; float: left}

#content {margin-left: 11em;}

--
dorayme

In article <op.twezu4y1qnv3q9@metallium>,
Rik <luiheidsgoeroe.DeleteThis@hotmail.com> wrote:

> Why is this in a table BTW? Doesn't make sense to me.

You must be kidding. Does it not make sense to you or are you
pretending it does not to make a point. I know what the point is,
the OP might not.

--
dorayme

On Thu, 02 Aug 2007 06:46:55 +0200, dorayme
<doraymeRidThis.TakeThisOut@optusnet.com.au> wrote:

> In article <op.twezu4y1qnv3q9@metallium>,
> Rik <luiheidsgoeroe.TakeThisOut@hotmail.com> wrote:
>
>> Why is this in a table BTW? Doesn't make sense to me.
>
> You must be kidding. Does it not make sense to you

Yes, was I unclear?
d.o.e.s. n.o.t. s.e.n.s.e t.o. m.e. m.a.ke.

> or are you
> pretending it does not to make a point. I know what the point is,
> the OP might not.

A lesson told is not the same as a lesson learned. You haven't told him, I
haven't told him. Let's let him think why he needs the table, that's all I
ask. Determining the own reasons for your actions, and sharing them with
others who question them, leads to better understanding.

Besides, this seems to be a minimal test case I'm so fond of, so maybe
there's more to it to make the table make sense, just curious, I for one
can imagine some scenarios in which it does. Not very common scenarios,
but nonetheless...
--
Rik Wasmus

In article <op.twe1qgvpqnv3q9@metallium>,
Rik <luiheidsgoeroe RemoveThis @hotmail.com> wrote:

> On Thu, 02 Aug 2007 06:46:55 +0200, dorayme
> <doraymeRidThis RemoveThis @optusnet.com.au> wrote:
>
> > In article <op.twezu4y1qnv3q9@metallium>,
> > Rik <luiheidsgoeroe RemoveThis @hotmail.com> wrote:
> >
> >> Why is this in a table BTW? Doesn't make sense to me.
> >
> > You must be kidding. Does it not make sense to you
>
> Yes, was I unclear?

There is a distinction between understanding something and not
approving of it. What quite do you _not_ understand? I realise
you likely do not approve of using a table purely to have a
couple of columns but there is nothing mysterious about it. trust
me, I do know some very good mysteries but this is certainly not
one of them. A table has columns and is ideally suited to be used
for when you want columns. Be very careful not to think that the
passion with which folk around these paddocks scorn such uses
equates to anything deeper than a penchant for a good and
reasonable alternative practice without tables.

--
dorayme

Ed Mullen wrote:
> This is odd to say the least. However, here's what I would try as the
> first and quickest "stab in the dark."
>
> On the machine(s) with the problem delete all the cookies related to
> comcast; delete all of them.
>
> Make sure javascript is enabled on those systems. Close the browser.
> Hell, reboot just for the heck of it. Try again.
>

BTW, this may be getting too far off-topic for this forum. If so, feel
free to take it to email and send your response to me.

--
Ed Mullen
http://edmullen.net
http://mozilla.edmullen.net
http://abington.edmullen.net
How do you tell when you run out of invisible ink?

In article <CtOdnc61YLxbNC_bnZ2dnUVZ_u3inZ2d.DeleteThis@comcast.com>,
Ed Mullen <ed.DeleteThis@edmullen.net> wrote:

> BTW, this may be getting too far off-topic for this forum. If so, feel
> free to take it to email and send your response to me.

You never invited me to get all personal like when I stray off
topic.

--
dorayme

dorayme wrote:
> In article <CtOdnc61YLxbNC_bnZ2dnUVZ_u3inZ2d DeleteThis @comcast.com>,
> Ed Mullen <ed DeleteThis @edmullen.net> wrote:
>
>> BTW, this may be getting too far off-topic for this forum. If so, feel
>> free to take it to email and send your response to me.
>
> You never invited me to get all personal like when I stray off
> topic.
>

What? You actually need an invitation? Geez!

--
Ed Mullen
http://edmullen.net
http://mozilla.edmullen.net
http://abington.edmullen.net
Does your train of thought have a caboose?

In article <qImdndoEtc2YLC_bnZ2dnUVZ_ubinZ2d.RemoveThis@comcast.com>,
Ed Mullen <ed.RemoveThis@edmullen.net> wrote:

> dorayme wrote:
> > In article <CtOdnc61YLxbNC_bnZ2dnUVZ_u3inZ2d.RemoveThis@comcast.com>,
> > Ed Mullen <ed.RemoveThis@edmullen.net> wrote:
> >
> >> BTW, this may be getting too far off-topic for this forum. If so, feel
> >> free to take it to email and send your response to me.
> >
> > You never invited me to get all personal like when I stray off
> > topic.
> >
>
> What? You actually need an invitation? Geez!

What do you mean Geez? Do you think I go around emailing strange
men just like that? What do you take me for? I send men around to
see people, uninvited like (ask Luigi, ask Boji), but just
emailing them... well, that is kind of too intimate for a
Martian. But still, I don't like being left out. I have strayed
off topic more than any earthling could and for a long time. So?
This guy comes along once and it gets a bit off topic and you
invite him to write to you PERSONALLY? I have been straying off -
goddamit - for years, I have broken every rule, I have been kf by
the best and the worst and what do I get for my efforts. I will
tell you: I get HEARTLESSNESS.

--
dorayme

dorayme wrote:
> In article <qImdndoEtc2YLC_bnZ2dnUVZ_ubinZ2d.TakeThisOut@comcast.com>,
> Ed Mullen <ed.TakeThisOut@edmullen.net> wrote:
>
>> dorayme wrote:
>>> In article <CtOdnc61YLxbNC_bnZ2dnUVZ_u3inZ2d.TakeThisOut@comcast.com>,
>>> Ed Mullen <ed.TakeThisOut@edmullen.net> wrote:
>>>
>>>> BTW, this may be getting too far off-topic for this forum. If so, feel
>>>> free to take it to email and send your response to me.
>>> You never invited me to get all personal like when I stray off
>>> topic.
>>>
>> What? You actually need an invitation? Geez!
>
> What do you mean Geez?

It's sort of a written expression of a verbal sigh. Not to worry, it's
a human thing.

> Do you think I go around emailing strange
> men just like that? What do you take me for?

I could say that I take you at face value but, hell, no face to value.
And, by the way, I am not all /that/ strange!!!

> I send men around to
> see people, uninvited like (ask Luigi, ask Boji), but just
> emailing them... well, that is kind of too intimate for a
> Martian. But still, I don't like being left out. I have strayed
> off topic more than any earthling could and for a long time. So?
> This guy comes along once and it gets a bit off topic and you
> invite him to write to you PERSONALLY? I have been straying off -
> goddamit - for years, I have broken every rule, I have been kf by
> the best and the worst and what do I get for my efforts. I will
> tell you: I get HEARTLESSNESS.
>

Uhh ... I am suddenly now feeling inadequate to the task of
inter-planetary ambassadorial duties.

Truly, all I was trying to do was be sensitive to Usenet stuff.

Look, if you ever feel a need or desire to communicate with an earthling
outside of the scope of this newsgroup's purpose, just go ahead and
email me. Most who actually know me find me to be ... well, hell, I
guess "mostly harmless" is all I can modestly claim. But I can provide
a list of references if you need that.

By the way, being a Martian, I meant to ask you how you celebrated (or
not) the recent 100th birthday anniversary of Robert A. Heinlein, the
author of "Stranger In A Strange Land." There was a wonderful article
about it a week or so ago in the Wall St. Journal.

--
Ed Mullen
http://edmullen.net
http://mozilla.edmullen.net
http://abington.edmullen.net
It is bad luck to be superstitious.