HighDots Forums  

IE h1 bottom-border won't appear

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss IE h1 bottom-border won't appear in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
awec
 
Posts: n/a

Default IE h1 bottom-border won't appear - 06-07-2009 , 06:53 AM






I'm trying to get a 1px solid #fff border-bottom on my h1 elements,
however no matter what I do it won't appear. I have tried setting the
width of the h1, the height etc but I just cannot get it to appear.

It works perfectly fine in firefox.

Heres my code:

h1{
font-size: 40px;
color: #FFFFFF;
border-bottom: 1px solid #ffffff;
width: 100%;
}

Any ideas?

Many thanks.

Reply With Quote
  #2  
Old   
Jukka K. Korpela
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 07:06 AM






awec wrote:

Quote:
I'm trying to get a 1px solid #fff border-bottom on my h1 elements,
It's somewhat questionable as a goal, since underlining generally means link
on the Web and bottom border looks much like underline (though it's somewhat
different). This might not be serious if the border extends over the entire
width of the document's body element, as it does by default when set on a
block element.

Quote:
however no matter what I do it won't appear.
URL? IE version?

Quote:
h1{
font-size: 40px;
color: #FFFFFF;
border-bottom: 1px solid #ffffff;
width: 100%;
}
The entire heading is invisible if the background is white, as it usually is
by default. Didn't your mom... I mean the CSS tutorial you read teach you to
set background whenever you set color and vice versa?

With background set to something dark, I have no problems in seeing the
border on my IE 8.

There's something you're not telling us. And the URL is one of those things.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

Reply With Quote
  #3  
Old   
awec
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 07:39 AM



Jukka K. Korpela wrote:
Quote:
awec wrote:

I'm trying to get a 1px solid #fff border-bottom on my h1 elements,

It's somewhat questionable as a goal, since underlining generally means
link on the Web and bottom border looks much like underline (though it's
somewhat different). This might not be serious if the border extends
over the entire width of the document's body element, as it does by
default when set on a block element.

however no matter what I do it won't appear.

URL? IE version?

h1{
font-size: 40px;
color: #FFFFFF;
border-bottom: 1px solid #ffffff;
width: 100%;
}

The entire heading is invisible if the background is white, as it
usually is by default. Didn't your mom... I mean the CSS tutorial you
read teach you to set background whenever you set color and vice versa?

With background set to something dark, I have no problems in seeing the
border on my IE 8.

There's something you're not telling us. And the URL is one of those
things.

IE7.

1. Url: http://threepints.co.uk/web/1/#
2. The reason I want it is not questionable at all. I want the
border-bottom to be the entire width, not just under the text.
3. Your attempted humour at bringing my "mom" into this is actually not
funny at all.
4. Background color is set in body{}. I am not an idiot, so your sarcasm
is wasted on me.

Thanks.

Reply With Quote
  #4  
Old   
Pil (Trustworthy from Experience)
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 10:32 AM



On Jun 7, 1:39*pm, awec <a... (AT) noreply (DOT) com> wrote:
Quote:
all. I want the
border-bottom to be the entire width, not just under the text.

Your h1 is nested in two other block level elements namely wrapper and
title.
wrapper has a defined width of 70% and title has a defined padding of
10px on every side. And thats the reason why the bottom border of h1
doesn't use the entire width of wrapper - neither in Firefox nor in
IE.

Reply With Quote
  #5  
Old   
Jukka K. Korpela
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 12:13 PM



awec wrote:

(fullquote, always a useful cluelessness indicator)

Quote:
1. Url: http://threepints.co.uk/web/1/#
Didn't your mom... I mean HTML primer tell you to validate your markup at
least before posting a question about your page in a public forum?

Quote:
4. Background color is set in body{}.
Maybe, maybe not. It wasn't in the code you originally posted.

Quote:
I am not an idiot,
Then stop behaving like one.

--
Yucca, http://www.cs.tut.fi/~jkorpela/

Reply With Quote
  #6  
Old   
Adrienne Boswell
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 01:38 PM



Gazing into my crystal ball I observed awec <awec (AT) noreply (DOT) com> writing in
news:h0g8sj$jo1$1 (AT) news (DOT) eternal-september.org:

Quote:
The entire heading is invisible if the background is white, as it
usually is by default. Didn't your mom... I mean the CSS tutorial you
read teach you to set background whenever you set color and vice
versa?

Quote:
3. Your attempted humour at bringing my "mom" into this is actually not
funny at all.
I think Jukka may have meant to say Google and other SEs. If the text is
the same color as the body, a site is penalized and removed from the
index.

Quote:
4. Background color is set in body{}. I am not an idiot, so your
sarcasm
is wasted on me.
Although the background color is set in the body, I always include either
the background color itself, or set the background color to transparent
when ever I set a color on an element.

--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

Reply With Quote
  #7  
Old   
Jukka K. Korpela
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 02:19 PM



Adrienne Boswell wrote:

Quote:
I think Jukka may have meant to say Google and other SEs.
No, I didn't. I simply referred to the risk that text color and background
color might coincide or bee too close to each other or an otherwise
unsuitable combination.

Quote:
If the
text is the same color as the body, a site is penalized and removed
from the index.
Maybe in some cases, but I don't think search engines process CSS. They have
been claimed to pay attention to coloring with HTML markup, in order to
detect tricks like "invisible" text used to fool search engines. It would be
essentially more complicated to detect such things in CSS. Not impossible,
tough.

Quote:
4. Background color is set in body{}. I am not an idiot, so your
sarcasm is wasted on me.

Although the background color is set in the body, I always include
either the background color itself, or set the background color to
transparent when ever I set a color on an element.
The background of the body element is the background of that element only.
Inner elements have backgrounds of their own, and if they are transparent,
the body background shines through. This creates the impression of
inheritance, even though background properties do not inherit.

Setting background for every element if you set color for it is a simple and
useful precaution. Making it transparent is risky, though perhaps a risk
worth taking if the safer way would be too cumbersome.

Consider this:

body { background: #fff; color: #000; }
h1 { background: transparent; color: #600; }

Now consider the following user stylesheet (say, for a person suffering from
a rare eyesight problem where white on black actually helps):

body { background: #200 !important; color: #fff !important; }

This user stylesheet is not optimal, since it does not set colors for any
inner elements, but it makes sense and you cannot say that it is wrong.

(Everyone surely figured out what happens?)

--
Yucca, http://www.cs.tut.fi/~jkorpela/

Reply With Quote
  #8  
Old   
Adrienne Boswell
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 04:02 PM



Gazing into my crystal ball I observed "Jukka K. Korpela"
<jkorpela (AT) cs (DOT) tut.fi> writing in
news:byTWl.10807$vi5.2160 (AT) uutiset (DOT) elisa.fi:

Quote:
Adrienne Boswell wrote:

I think Jukka may have meant to say Google and other SEs.

No, I didn't. I simply referred to the risk that text color and
background color might coincide or bee too close to each other or an
otherwise unsuitable combination.
I understand that - I was also doing that, in a different way.

Quote:
If the
text is the same color as the body, a site is penalized and removed
from the index.

Maybe in some cases, but I don't think search engines process CSS.
They have been claimed to pay attention to coloring with HTML markup,
in order to detect tricks like "invisible" text used to fool search
engines. It would be essentially more complicated to detect such
things in CSS. Not impossible, tough.
I'm pretty sure that they do. IIRC, there was a discussion a long time
ago in alt.internet.search-engines when just this very thing occurred. I
don't think they penalize for a slightly different color, but, they do if
they are the same, CSS or not.

Quote:
4. Background color is set in body{}. I am not an idiot, so your
sarcasm is wasted on me.

Although the background color is set in the body, I always include
either the background color itself, or set the background color to
transparent when ever I set a color on an element.

The background of the body element is the background of that element
only. Inner elements have backgrounds of their own, and if they are
transparent, the body background shines through. This creates the
impression of inheritance, even though background properties do not
inherit.

Setting background for every element if you set color for it is a
simple and useful precaution. Making it transparent is risky, though
perhaps a risk worth taking if the safer way would be too cumbersome.
I should have said that I do that only for links, other elements that
have inheritance I leave alone - if I bother coloring them at all.

Quote:
Consider this:

body { background: #fff; color: #000; }
h1 { background: transparent; color: #600; }

Now consider the following user stylesheet (say, for a person
suffering from a rare eyesight problem where white on black actually
helps):

body { background: #200 !important; color: #fff !important; }

This user stylesheet is not optimal, since it does not set colors for
any inner elements, but it makes sense and you cannot say that it is
wrong.

(Everyone surely figured out what happens?)

I happened to have a stylesheet editor open when you posted this, and of
course, I had to try it out for myself. What fun! Can I please do this
to someone I don't like, maybe a harassing telemarketer, please, pretty
please?

--
Adrienne Boswell at Home
Arbpen Web Site Design Services
http://www.cavalcade-of-coding.info
Please respond to the group so others can share

Reply With Quote
  #9  
Old   
awec
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 04:52 PM



Jukka K. Korpela wrote:
Quote:
awec wrote:

(fullquote, always a useful cluelessness indicator)

1. Url: http://threepints.co.uk/web/1/#

Didn't your mom... I mean HTML primer tell you to validate your markup
at least before posting a question about your page in a public forum?

4. Background color is set in body{}.

Maybe, maybe not. It wasn't in the code you originally posted.

I am not an idiot,

Then stop behaving like one.

Wouldn't be usenet without the resident know it all sarcastic fool now
would it.

Don't worry, the "your mom" statements give me an indication of your
mental age so I'll say no more for fear of upsetting you.


As for everyone else, thanks for the help, got it sorted. Appreciated.

Reply With Quote
  #10  
Old   
dorayme
 
Posts: n/a

Default Re: IE h1 bottom-border won't appear - 06-07-2009 , 07:07 PM



In article <h0h9at$jh4$1 (AT) news (DOT) eternal-september.org>,
awec <awec (AT) noreply (DOT) com> wrote:

Quote:
Don't worry, the "your mom" statements give me an indication of your
mental age so I'll say no more for fear of upsetting you.
JK using "didn't your mom.. teach you..." is not really about your mom.
It's a sort of idiomatic expression, a figure of speech, a bit American
I think, but having equivalents elsewhere. If you had your sense of
humour in good order and were in a calm mood, I am sure you would be
able to see this. In fact, if you were to take it seriously, it is
flattering to the average mom. I sure like the thought that my mom could
have helped me with all this stuff back in the olden days - when where
these, the 1930s, 1830's, I forget...

--
dorayme

Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.