two column irritation

A

aljones

I'm back with my frustration!

1) URL looks like: http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul> at
line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but none
that mean anything - to me)

What's wrong with it - and what's the solution?? If you please.

2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal columns /
etc till I'm blue in the face.
This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the bottoms
are probably going to be out of synch??

I really have to find a different play toy!!!!!
 
A

aljones

aljones said:
I'm back with my frustration!

1) URL looks like: http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul> at
line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but none
that mean anything - to me)

What's wrong with it - and what's the solution?? If you please.

2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal columns /
etc till I'm blue in the face.
This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the bottoms
are probably going to be out of synch??

I really have to find a different play toy!!!!!

Yes, I realize there are 10 validation errors. 9 of them come from the
script that yahoo puts after the html for gathering statistics - not my
choice of host, so I can only go with the flow. //al
 
A

andrew

I'm back with my frustration!

1) URL looks like: http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul>
at line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but
none that mean anything - to me)
[...]

Always keen to answer the easy question first :)

<ul>

<li> </li>
<li> </li>
<li>
<ul>
<li> </li>
<li> </li>
</ul>
</li>
<li> </li>
<li> </li>
</ul>

Andrew
 
D

dorayme

aljones said:
I'm back with my frustration!

First thing to do is put your pages through a validator or error
checker. You would surely pick up some of the mistakes then.

If you specify height and width in <img ...>, just use a pure
number. If you specify dimensions in CSS, always add the units.

About the list trouble, there have been recent threads on this.
An unordered list has list items as children, not further
unordered lists. A list item, on the other hand, can have an
unordered list within it.




1) URL looks like: http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul> at
line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but none
that mean anything - to me)

What's wrong with it - and what's the solution?? If you please.

2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal columns /
etc till I'm blue in the face.

I suggested ages ago to you, in your case, just use a table for
your page and be done. Can you afford to be going so blue in the
face?

About your graphic of the hands, it looks bad that it has a white
background, it is crying out for a transparent bg. Or change the
background of the header from grey to white. (This header is too
big height wise)


This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the bottoms
are probably going to be out of synch??

I really have to find a different play toy!!!!!

The toy is tables. Tables for you Al. Al and tables. All you need
is a two col job and Bob will be your uncle. Go ahead, abuse a
bit, you deserve it.
 
E

Ed Seedhouse

Ran W3C validation and it's complaining that I have an embedded <ul> at
line 24.

That would be because you do.
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>

The only allowed sub element of UL is LI. Anything else has to go
inside an LI, so:

<UL>
<li> </li>
<li>
<ul>
<li> </li>
<li> </li>
</ul>
</li>
</ul>
 
A

andrew

I'm back with my frustration! [...]
What's wrong with it - and what's the solution?? If you please.

2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal
columns / etc till I'm blue in the face.
This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the
bottoms are probably going to be out of synch??
[...]

Well, a quick fix would be to allow a body color to show through,
selecting the color of your navbar. So:

body {background-color:#5cb3ff;}

and specify different background colors for the other divs. Not
elegant I guess :) Your main content would need to be longer than your
navbar column.

BTW you have some weighty images loading there that gave my browser
(firefox 2) some trouble.

Andrew
 
D

dorayme

andrew said:
Documents (1 file) 3 kb
Images (8 files) 3039 kb
Style Sheets (1 file) 2kb
Total 3044 kb


no wonder fire fox barfed :)

Not much to do with Firefox. No browser is so magically different
in this respect.
 
J

Jukka K. Korpela

Scripsit aljones:
2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal columns
/ etc till I'm blue in the face.

Do you mean that you would want the navigation bar and the content proper
occupy the same height?
This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the
bottoms are probably going to be out of synch??

Well, it _seems_ that you want the blocks ("columns") to have the same
height, but you could have said that more directly.

Using a simple table is the simplest way. Stay tuned to getting flamed, at
least verbally, by purists if you take that path.

(Well, the _simplest_ way is to stop wanting that. Why should two completely
unrelated blocks have the same visual height?)

If you use the current approach (div elements and CSS), then perhaps the
simplest way is to wrap the div elements #navbar and #content inside an
outer div element, set the background you want for #navbar (some blue) to
that outer div and the desired background for #content. Set #navbar
background to transparent.

This way, #navbar will still have just its natural height, but it _looks_ as
tall as #content.

P.S. You had two completely unrelated questions. It's best to ask such
questions in separate messages. That would let you write Subject lines that
reflect well the content; now your Subject line didn't even give a hint
about your first question.
 
B

Ben C

I'm back with my frustration!

1) URL looks like: http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul> at
line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but none
that mean anything - to me)

What's wrong with it - and what's the solution?? If you please.

2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal columns /
etc till I'm blue in the face.
This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the bottoms
are probably going to be out of synch??

Make an image, 195px wide by 1px high in that same shade of blue as your
navbar. Call it navback.png. Add

body { background: url(navback.png) repeat-y; }

to the styles. I would credit whoever's idea this was if I could
remember where I first read it.

It's a cheat, but gets you fewer points on your purist's licence than a
table.
 
C

Chaddy2222

I'm back with my frustration!

1) URL looks like:http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul> at
line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but none
that mean anything - to me)

What's wrong with it - and what's the solution?? If you please.

2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal columns /
etc till I'm blue in the face.
This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the bottoms
are probably going to be out of synch??

I really have to find a different play toy!!!!!
I think your first question has been answered, but as for you second
queation.
Maybe try setting a wrapper div on the page and in your stylesheet,
give it a width of 100% and then remove the width of everything else.
Oh and I agree with the background colour idea.
 
J

John Hosking

aljones said:
2) http://brokenchainsministry.net/products.html
I've looked at uneven columns / unequal columns / css unequal columns /
etc till I'm blue in the face.
This page is the most atrocious of the situations I see, but could
someone please direct me to a reference that (please, I'm begging)
specifically describes how to 'fix' a two column page where the bottoms
are probably going to be out of synch??

top: bottom-10px;
Hehe. Nice try, but not valid.


Is this what you want?
#footer {
margin: 0; padding: 0;
font-size: 90%; text-align: center;
color: #306EFF; background-color: #C0C0C0;
clear:both; width:100%; } /* <= my changes */


Some more reading, if you haven't already seen them:
http://css.maxdesign.com.au/floatutorial/tutorial0816.htm

http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/

http://www.positioniseverything.net/articles/onetruelayout/

HTH
 
M

mbstevens

1) URL looks like: http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul> at
line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but none
that mean anything - to me)

You can't do this:
<ul>
<ul>
</ul>
</ul>

You can, however, do this:
<ul>
<li>
<ul>
</ul>
</li>
</ul>

BTW, those images of hands are......creepy.
 
A

aljones

dorayme said:
Not much to do with Firefox. No browser is so magically different
in this respect.

Sheesh! Alright, already ... This was intended more as an incentive for
Annette to get me some content to go with the images, and as I uploaded
them I actually realized how big they are - they'll be resized shortly.

//al
 
A

aljones

andrew said:
I'm back with my frustration!

1) URL looks like: http://brokenchainsministry.net/prodsupport.html
Ran W3C validation and it's complaining that I have an embedded <ul>
at line 24. As an example ....
<UL>
<li> </li>
<li> </li>
<ul>
<li> </li>
<li> </li>
</ul>
</ul>
Googling for embed <ul> (and several variations give me a lot - but
none that mean anything - to me)
[...]

Always keen to answer the easy question first :)

<ul>

<li> </li>
<li> </li>
<li>
<ul>
<li> </li>
<li> </li>
</ul>
</li>
<li> </li>
<li> </li>
</ul>

Andrew

This one of those "I've looked at it! I've looked high and low!" then
'Oh, now I see, duh!' I don't know how many times I've looked at
embedded lists as a list item - but I just wasn't seeing it. Thanks //al
 
A

aljones

dorayme said:
First thing to do is put your pages through a validator or error
checker. You would surely pick up some of the mistakes then.

If you specify height and width in <img ...>, just use a pure
number. If you specify dimensions in CSS, always add the units.

About the list trouble, there have been recent threads on this.
An unordered list has list items as children, not further
unordered lists. A list item, on the other hand, can have an
unordered list within it.






I suggested ages ago to you, in your case, just use a table for
your page and be done. Can you afford to be going so blue in the
face?
No, no tables! And I like blue! It just doesn't go with my green hair!!
About your graphic of the hands, it looks bad that it has a white
background, it is crying out for a transparent bg. Or change the
background of the header from grey to white. (This header is too
big height wise)
After having a virus eat my hard drive (actually only the 'FSType' byte
and maybe a few other related that I couldn't set back), I've pulled up
a linux box. (PCLinuxOS which surprisingly isn't too bad.) I'll try
again with gimp to sett he background color in the hands but my first
couple of tries (apparenly) always missed a pixel so the whole thing got
filled in .... argh!
The toy is tables. Tables for you Al. Al and tables. All you need
is a two col job and Bob will be your uncle. Go ahead, abuse a
bit, you deserve it.

NO! NO TABLES! In the first place I want to do it without; in the
second I don't want to take the flak if I did!

But seriously (or at least a little more seriously) I do appreciate the
comments.
 
A

aljones

Ed said:
That would be because you do.


The only allowed sub element of UL is LI. Anything else has to go
inside an LI, so:

<UL>
<li> </li>
<li>
<ul>
<li> </li>
<li> </li>
</ul>
</li>
</ul>

Noted and commented on elsewhere, thanks ...
 
A

aljones

Jukka said:
Scripsit aljones:


Do you mean that you would want the navigation bar and the content
proper occupy the same height?
No, I want them to appear as if they do.
Well, it _seems_ that you want the blocks ("columns") to have the same
height, but you could have said that more directly.

Using a simple table is the simplest way. Stay tuned to getting flamed,
at least verbally, by purists if you take that path.

(Well, the _simplest_ way is to stop wanting that. Why should two
completely unrelated blocks have the same visual height?)
Mostly because I'd really like to have the footer appear after
everything else on the page. It looks really odd (to me) for the footer
on a page which has short content to fall under the content without
falling under the nav bar as well.
If you use the current approach (div elements and CSS), then perhaps the
simplest way is to wrap the div elements #navbar and #content inside an
outer div element, set the background you want for #navbar (some blue)
to that outer div and the desired background for #content. Set #navbar
background to transparent.

This way, #navbar will still have just its natural height, but it
_looks_ as tall as #content.

P.S. You had two completely unrelated questions. It's best to ask such
questions in separate messages. That would let you write Subject lines
that reflect well the content; now your Subject line didn't even give a
hint about your first question.
I thought about that as I was posting it. I th9ink my decision was
fianlly that the first question would be simple enough that I could
'wing it' along with the other.

As it is, I've gotten some really good (again, to me) comments on both.
 
D

dorayme

The toy is tables. Tables for you Al. Al and tables. All you need
is a two col job and Bob will be your uncle. Go ahead, abuse a
bit, you deserve it.

NO! NO TABLES! In the first place I want to do it without; in the
second I don't want to take the flak if I did![/QUOTE]

There are good defences, on health grounds. It is bad to be going
so blue in the face.
 
D

dorayme

aljones said:
Mostly because I'd really like to have the footer appear after
everything else on the page. It looks really odd (to me) for the footer
on a page which has short content to fall under the content without
falling under the nav bar as well.

Well, it does not matter. It is a line containing a bit of
information in small print. And it is at the bottom of your main
content. It is no big deal. People get very quickly used to the
style within a site as long as it is consistent and sensible.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top