a few minor problems with website

[steven]

Hi,
I've got more or less the design I wanted (http://www.nenya.be/20041211/),
except for 2 details:

1. the menu's left border doesn't cover the full height of the menu if the
main div is higher than the menu's. How can I make it run down to the
footer?

2. currently the long description wraps and continues aligned with the
bullet. Is there a way to indent it so that the "second" is aligned with the
"long"?

TIA
Steven

(in case you're wondering: the woman in the picture is Audrey Hepburn)

[musicinmyhead]

For #1 there, I think the best solution would simply be to use the
"faux columns" trick detailed here:
http://www.alistapart.com/articles/fauxcolumns/
That way you don't have to worry about the bothersome CSS to try and
get it to work.

For #2 it seems like the best idea would be to make the margin-left
less, and add a text-indent. For instance if you change the margin-left
to -58px and add a text-indent of about -12px it looks like it evens
out the elements. Since text-indent only indents the first line, you
basically just put a negative indent on the first lines and even out
the margins, and they should show up just fine.

[musicinmyhead]

Oh by the way, of course IE and Firefox have slight differences with
the indents (IE needing to have more indent and less margin). So in IE
the margin-left should be -54px and the text-indent should be -16px and
there you go.

[musicinmyhead]

For #1 there, I think the best solution would simply be to use the
"faux columns" trick detailed here:
http://www.alistapart.com/articles/fauxcolumns/
That way you don't have to worry about the bothersome CSS to try and
get it to work.

For #2 it seems like the best idea would be to make the margin-left
less, and add a text-indent. For instance if you change the margin-left
to -58px and add a text-indent of about -12px it looks like it evens
out the elements. Since text-indent only indents the first line, you
basically just put a negative indent on the first lines and even out
the margins, and they should show up just fine.

[Neal]

musicinmyhead:

For #1 there,

Where? Please quote the previous poster to give context. Usenet postings
propogate in different ways, and it's as likely as not your reply will
show up on a news client earlier than the other post. Also, it is possible
a post may never get there at all, or that for some reason the threading
is broken at some point.

[steven]

"musicinmyhead" <mu***********@hybrid-fusion.com> wrote in message
news:11*********************@c13g2000cwb.googlegro ups.com...

For #1 there, I think the best solution would simply be to use the
"faux columns" trick detailed here:
http://www.alistapart.com/articles/fauxcolumns/
That way you don't have to worry about the bothersome CSS to try and
get it to work.

Works like a charm, and is embarasingly simple, like they say on ALA.
Still is a cheat, of course. Something to fix in the next CSS version?
(My buttons are exactly the same as the ones on ALA! I wonder...)

For #2 it seems like the best idea would be to make the margin-left
less, and add a text-indent. For instance if you change the margin-left
to -58px and add a text-indent of about -12px it looks like it evens
out the elements. Since text-indent only indents the first line, you
basically just put a negative indent on the first lines and even out
the margins, and they should show up just fine.

Also a simple idea, and that's maybe why I didn't think of it.
Thanx, MimH ;-)

[steven]

"musicinmyhead" <mu***********@hybrid-fusion.com> wrote in message
news:11*********************@f14g2000cwb.googlegro ups.com...

Oh by the way, of course IE and Firefox have slight differences with
the indents (IE needing to have more indent and less margin). So in IE
the margin-left should be -54px and the text-indent should be -16px and
there you go.

Yes, I know. I position for Firefox, and I already noticed that for instance
the bullets are slightly offset in Internet Exploder. I got used to
different rendering under IE, and as long as it's just a few pixels I don't
really care.
But, for the sake of argument, could I apply a different stylesheet for IE
if I wanted to?
Thanx again

Steven

[musicinmyhead]

Yes you can use different stylesheets for IE and Moz/Netscape, but
you'll need to use a scripting language to do so. If you want to do so
client-side you can use JavaScript, or if you want to do it server-side
you can use PHP, I'll detail both ways below:

Using javascript:
if (navigator.appName == "Netscape") {
document.write('<link rel="StyleSheet" type="text/css"
href="MozFile.css" />');
}
else {
document.write('<link rel="StyleSheet" type="text/css"
href="IEFile.css" />');
}

And if you're using PHP (which I would recommend), you can do this:
if(strstr($_SERVER['HTTP_USER_AGENT'], "Gecko")){
echo ' <link rel="StyleSheet" type="text/CSS" href="Moz.css" />';
}
else{
echo ' <link rel="StyleSheet" type="text/CSS" href="IE.css" />';
}

I would recommend using the server-side scripting (PHP) for doing this,
because it will work even when the user has JavaScript disabled in the
browser. It is also better because you actually see the <link> tag in
the source, while the JavaScript's document.write('<link> etc.. will
not show up when viewing the source.

[musicinmyhead]

> Where? Please quote the previous poster to give context. Usenet
postings

propogate in different ways, and it's as likely as not your reply will show up on a news client earlier than the other post. Also, it is possible a post may never get there at all, or that for some reason the threading is broken at some point.

Oh sorry, I'm using those new fangdangled Google Groups, so I didn't
know it wasn't quoting the person that I replied to. Here's the
original question from "Steven":

"Hi,
I've got more or less the design I wanted
(http://www.nenya.be/20041211/),
except for 2 details:

1. the menu's left border doesn't cover the full height of the menu if
the
main div is higher than the menu's. How can I make it run down to the
footer?

2. currently the long description wraps and continues aligned with the
bullet. Is there a way to indent it so that the "second" is aligned
with the
"long"?

TIA
Steven
(in case you're wondering: the woman in the picture is Audrey Hepburn)"

[Jan Roland Eriksson]

On 11 Dec 2004 15:00:46 -0800, "musicinmyhead"
<mu***********@hybrid-fusion.com> wrote:

Yes you can use different stylesheets for IE and Moz/Netscape, but
you'll need to use a scripting language to do so.
That part of your input is bogus enough to disqualify all the rest of
your writing in this post.

--
Rex









If you want to do soclient-side you can use JavaScript, or if you want to do it server-side
you can use PHP, I'll detail both ways below:

Using javascript:
if (navigator.appName == "Netscape") {
document.write('<link rel="StyleSheet" type="text/css"
href="MozFile.css" />');
}
else {
document.write('<link rel="StyleSheet" type="text/css"
href="IEFile.css" />');
}

And if you're using PHP (which I would recommend), you can do this:
if(strstr($_SERVER['HTTP_USER_AGENT'], "Gecko")){
echo ' <link rel="StyleSheet" type="text/CSS" href="Moz.css" />';
}
else{
echo ' <link rel="StyleSheet" type="text/CSS" href="IE.css" />';
}

I would recommend using the server-side scripting (PHP) for doing this,
because it will work even when the user has JavaScript disabled in the
browser. It is also better because you actually see the <link> tag in
the source, while the JavaScript's document.write('<link> etc.. will
not show up when viewing the source.

[musicinmyhead]

> That part of your input is bogus enough to disqualify all the rest of

your writing in this post.

Seeing as you made no effort to answer the post yourself, and both
methods I've posted work perfectly fine, I'll be ignoring the rest of
your replies ;)

[Jan Roland Eriksson]

On 11 Dec 2004 18:19:25 -0800, "musicinmyhead"
<mu***********@hybrid-fusion.com> wrote:

That part of your input is bogus enough to disqualify all the rest of
your writing in this post.

...both methods I've posted work perfectly fine...

Javascript will not "work" if it's turned off or not supported.

HTTP_USER_AGENT is notoriously unreliable.

There is at least one other reliable[1] way to make IE evaluate style
info that is not evaluated by any other browser.

http://www.quirksmode.org/css/condcom.html

[1] "Reliable" today, what MS will do for the future can not be
predicted.

--
Rex

[kchayka]

on 2004-12-11 steven wrote:

"musicinmyhead" <mu***********@hybrid-fusion.com> wrote in message
news:11*********************@c13g2000cwb.googlegro ups.com...

For #2 it seems like the best idea would be to make the margin-left
less, and add a text-indent.

Also a simple idea, and that's maybe why I didn't think of it.

An even simpler solution is to correct your CSS so text wraps the way you
want without any added kludges:

#rightcol ul li {
list-style: disc url(../img/listmark.gif) inside;
}

Get rid of the "inside" value. See
<URL:http://www.w3.org/TR/CSS21/generate.html#propdef-list-style-position>

BTW, the margin-left on that rule looks like another kludge. I don't know
what it's supposed to accomplish, but I'd bet there is a better way.

[steven]

"kchayka" <us****@c-net.us> wrote in message
news:xn***************@news.individual.net...

on 2004-12-11 steven wrote:

"musicinmyhead" <mu***********@hybrid-fusion.com> wrote in message
news:11*********************@c13g2000cwb.googlegro ups.com...

For #2 it seems like the best idea would be to make the margin-left
less, and add a text-indent.
Also a simple idea, and that's maybe why I didn't think of it.

An even simpler solution is to correct your CSS so text wraps the way you
want without any added kludges:

#rightcol ul li {
list-style: disc url(../img/listmark.gif) inside;
}

Get rid of the "inside" value. See
<URL:http://www.w3.org/TR/CSS21/generate.html#propdef-list-style-position>

OK.

BTW, the margin-left on that rule looks like another kludge. I don't know
what it's supposed to accomplish, but I'd bet there is a better way.

I don't know, but if I don't set the left margin the bullets appear way too
far to the right (almost in the middle of the column).
Could that be the default indent? I doubt it, since I had to move it 50
pixels to the left to get it more or less where I'd expect it in the first
place.
If there's a better way, please let me know.
TIA

Steven

[kchayka]

steven wrote:

"kchayka" <us****@c-net.us> wrote in message
news:xn***************@news.individual.net...

BTW, the margin-left on that rule looks like another kludge. I don't know
what it's supposed to accomplish, but I'd bet there is a better way.
I don't know, but if I don't set the left margin the bullets appear way too
far to the right (almost in the middle of the column).

That's probably from the default list indents. Various list elements
(dl, dt, dd, ul, li) have some default indent, but you're not accounting
for all of them in your stylesheet, only some. dd is probably adding a lot.
If there's a better way, please let me know.

Set both margin-left and padding-left on every list element and you'll
get more consistent results. You need to set both because some browsers
use margin for the indent, others use padding.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.