Horizontal Rule Graphic in Theme/CSS?

[Charax]

Back in the FP97 days, I modified the Expedition theme for my web site at
www.parthia.com (which was published using FP2002)

Now I find that HR is no longer a theme component in FP2003, but I do see it
as a text item that can be modified.

Can anyone tell me how to substitute a graphic image for <hr> in a FrontPage
2003 theme? Or a technique using CSS?

Many thanks in advance,

Chris Hopkins

 

[Stefan B Rusynko]

HR images is unsupported in CSS
Either use the non image CSS styles for HR
or just do a Search & Replace for the HR tags in your html and replace it w/ any image of a line
(even the image from your old theme)

--




| Back in the FP97 days, I modified the Expedition theme for my web site at
| www.parthia.com (which was published using FP2002)
|
| Now I find that HR is no longer a theme component in FP2003, but I do see it
| as a text item that can be modified.
|
| Can anyone tell me how to substitute a graphic image for <hr> in a FrontPage
| 2003 theme? Or a technique using CSS?
|
| Many thanks in advance,
|
| Chris Hopkins
|

 

[Charax]

HR images is unsupported in CSS
Either use the non image CSS styles for HR
or just do a Search & Replace for the HR tags in your html and replace it w/ any image of a line
(even the image from your old theme)

Thanks, Steve. I'll use the global search & replace to replace <hr> with the
image already used throughout the site.

But for future pages -- I haven't investigated this yet, but can I write
some code in VBA, or create a macro, to insert the HR graphic replacement
instead of HR? I'll need the function often, and a button on the toolbar
would be very handy. I do this type of thing in MS Access all the time, but
haven't investigated coding toolbar buttons in FrontPage.

Cheers,

Chris

 

[Stefan B Rusynko]

Yes you could create VBA to insert the image at an insertion point in the current page
I just use Copy / Paste
With FP 2003 consider using Dynamic Web Templates instead for the repetitive stuff

--




| > HR images is unsupported in CSS
| > Either use the non image CSS styles for HR
| > or just do a Search & Replace for the HR tags in your html and replace it
| w/ any image of a line
| > (even the image from your old theme)
|
| Thanks, Steve. I'll use the global search & replace to replace <hr> with the
| image already used throughout the site.
|
| But for future pages -- I haven't investigated this yet, but can I write
| some code in VBA, or create a macro, to insert the HR graphic replacement
| instead of HR? I'll need the function often, and a button on the toolbar
| would be very handy. I do this type of thing in MS Access all the time, but
| haven't investigated coding toolbar buttons in FrontPage.
|
| Cheers,
|
| Chris
|

 

[Charax]

Yes you could create VBA to insert the image at an insertion point in the current page
I just use Copy / Paste
With FP 2003 consider using Dynamic Web Templates instead for the

repetitive stuff

Many thanks. I'm off to discover dynamic web templates....

Chris

 

[Charax]

It turns out that CSS does support the graphic HR. Some browsers don't
support it fully, but you can compensate for it by using DIV.

Two excellent discussions of using a graphic as HR may be found:
http://www.sovavsiti.cz/css/hr.html
http://ppewww.ph.gla.ac.uk/~flavell/www/hrstyle.html#conc)

I chose to add to CSS page:
*/
div.hr {
height: 10px;
background: url('hr.gif') no-repeat scroll center;
}
div.hr hr {
display: none;
}

Implementing code for the web page: <div class="hr"><hr /></div>

Cheers,

Chris Hopkins
www.parthia.com

 

[Stefan B Rusynko]

Think you need to study HTML and CSS
- that is not CSS applied to HR tag, it is just CSS applied to a DIV tag
(which happens to contain a HR tag)

The styles are showing an image for the DIV block and hiding the HR

--




| It turns out that CSS does support the graphic HR. Some browsers don't
| support it fully, but you can compensate for it by using DIV.
|
| Two excellent discussions of using a graphic as HR may be found:
| http://www.sovavsiti.cz/css/hr.html
| http://ppewww.ph.gla.ac.uk/~flavell/www/hrstyle.html#conc)
|
| I chose to add to CSS page:
| */
| div.hr {
| height: 10px;
| background: url('hr.gif') no-repeat scroll center;
| }
| div.hr hr {
| display: none;
| }
|
| Implementing code for the web page: <div class="hr"><hr /></div>
|
| Cheers,
|
| Chris Hopkins
| www.parthia.com
|
| > HR images is unsupported in CSS
| > Either use the non image CSS styles for HR
| > or just do a Search & Replace for the HR tags in your html and replace it
| w/ any image of a line
| > (even the image from your old theme)
| >
| > | Back in the FP97 days, I modified the Expedition theme for my web site
| at
| > | www.parthia.com (which was published using FP2002)
| > |
| > | Now I find that HR is no longer a theme component in FP2003, but I do
| see it
| > | as a text item that can be modified.
| > |
| > | Can anyone tell me how to substitute a graphic image for <hr> in a
| FrontPage
| > | 2003 theme? Or a technique using CSS?
| > |
| > | Many thanks in advance,
| > |
| > | Chris Hopkins
|

 

[Charax]

Perhaps you missed my point. You said "HR images is unsupported in CSS".

CSS *does* support redefining HR as a graphic:
hr {
height: 10px;
background: url('hr.gif') no-repeat scroll center;
}

Unfortunately not all browsers handle that bit of code (Mozilla does
nicely), so it needs to be wrapped in a DIV for wide compatibility.

Cheers,

Chris Hopkins
www.parthia.com