Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   HTML (http://www.velocityreviews.com/forums/f31-html.html)
-   -   CSS Border Bottom Effect: <h1> vs Using A Class (http://www.velocityreviews.com/forums/t161128-css-border-bottom-effect-h1-vs-using-a-class.html)

Lauri Raittila 03-03-2005 12:47 AM

Re: CSS Border Bottom Effect: <h1> vs Using A Class
 
in alt.html, Fred wrote:


> http://mywebpages.comcast.net/surge42/h1style.htm


> Is there a way to have this same exact effect by assigning a class
> instead?


Yes, it works. You have most likely tried it on a element (the classname
you have is not used on your page), which is inline. Add display:block,
or better, use style on suitable container.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Utrecht, NL.

Mark Parnell 03-03-2005 01:01 AM

Re: CSS Border Bottom Effect: <h1> vs Using A Class
 
Previously in alt.html, Fred <x@x.com> said:

> http://mywebpages.comcast.net/surge42/h1style.htm
>
> Is there a way to have this same exact effect by assigning a class
> instead?


Yes:

h1.classname {...}

<h1 class="classname">...</h1>

But in this case there wouldn't be any difference.

> For some reason the border-bottom line will not extend beyond
> the text.


Does here (Moz 1.7.5, Win 2k).

--
Mark Parnell
http://www.clarkecomputers.com.au

Fred 03-03-2005 03:29 AM

CSS Border Bottom Effect: <h1> vs Using A Class
 
Hello

<style type="text/css">
<!--
h1 {
margin-top: 0.8em;
margin-left: 28px;
margin-right: 2em;
font-size: 1.2em;
border-bottom-width: 2px;
border-bottom-color: #D7D7D7;
border-bottom-style: solid;
padding-bottom: 3px;
text-align: left;
}
-->
</style>


This style controls <h1> so that it looks like this...

http://mywebpages.comcast.net/surge42/h1style.htm

Is there a way to have this same exact effect by assigning a class
instead? For some reason the border-bottom line will not extend beyond
the text.





Mark Parnell 03-03-2005 05:24 AM

Re: CSS Border Bottom Effect: <h1> vs Using A Class
 
Previously in alt.html, Fred <x@x.com> said:

> <span class="LineContinuesLikeitDoesWith_h1">
> How would the CSS look in this situation?


The problem is that span is an inline element; headings are block-level
elements.

The solution would be to add { display: block; } to the CSS for the
span, but this will probably cause other unwanted side effects.

BTW: Please don't post upside down.
http://www.allmyfaqs.com/faq.pl?How_to_post
http://en.wikipedia.org/wiki/Top-posting

--
Mark Parnell
http://www.clarkecomputers.com.au

Toby Inkster 03-03-2005 08:16 AM

Re: CSS Border Bottom Effect: <h1> vs Using A Class
 
Fred wrote:

> For some reason the border-bottom line will not extend beyond the text.


You are possibly trying to set the border on an inline element. Inline and
block elements behave differently with borders.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact


Fred 03-03-2005 08:21 AM

Re: CSS Border Bottom Effect: <h1> vs Using A Class
 
Let me ask it this way...

I'd like to achieve the same effect with out using <h1> at all.
Actually I'd like to apply the effect this way..

<span class="LineContinuesLikeitDoesWith_h1">
How would the CSS look in this situation?

The reason I'm asking is because I'm changing styles that are applied
to dynamically created HTML. And the classes are already defined.

There are no <h1>'s used...

I have no other choice but to apply the styles to <span>

thnx



On Thu, 3 Mar 2005 12:01:27 +1100, Mark Parnell
<webmaster@clarkecomputers.com.au> wrote:

>Previously in alt.html, Fred <x@x.com> said:
>
>> http://mywebpages.comcast.net/surge42/h1style.htm
>>
>> Is there a way to have this same exact effect by assigning a class
>> instead?

>
>Yes:
>
>h1.classname {...}
>
><h1 class="classname">...</h1>
>
>But in this case there wouldn't be any difference.
>
>> For some reason the border-bottom line will not extend beyond
>> the text.

>
>Does here (Moz 1.7.5, Win 2k).



Fred 03-03-2005 05:16 PM

Re: CSS Border Bottom Effect: <h1> vs Using A Class
 
On Thu, 03 Mar 2005 08:16:31 +0000, Toby Inkster
<usenet200503@tobyinkster.co.uk> wrote:

>Fred wrote:
>
>> For some reason the border-bottom line will not extend beyond the text.

>
>You are possibly trying to set the border on an inline element. Inline and
>block elements behave differently with borders.



I'm reading between the lines here and I think I'm screwed.
I'm going to have to start digging into the script (PERL) and change
it so that the printed html uses <h1> instead of <span>

I thought there might be a way to apply a special style to the
existing tag thats used <span>.

Thanks for the help guys
Fred

Toby Inkster 03-03-2005 06:21 PM

Re: CSS Border Bottom Effect: <h1> vs Using A Class
 
Fred wrote:

> I thought there might be a way to apply a special style to the
> existing tag thats used <span>.


There is. As others have said: "display:block".

--
Toby A Inkster BSc (Hons) ARCS
Contact Me ~ http://tobyinkster.co.uk/contact



All times are GMT. The time now is 06:29 PM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.