Wrox Programmer Forums
Go Back   Wrox Programmer Forums > Web Programming > HTML > BOOK: Beginning HTML, XHTML, CSS, and JavaScript
| Search | Today's Posts | Mark Forums Read
BOOK: Beginning HTML, XHTML, CSS, and JavaScript
This is the forum to discuss the Wrox book Beginning HTML, XHTML, CSS, and JavaScript by Jon Duckett; ISBN: 978-0-470-54070-1
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Beginning HTML, XHTML, CSS, and JavaScript section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
  #1 (permalink)  
Old April 7th, 2010, 09:34 AM
Registered User
 
Join Date: Apr 2010
Location: Planet Earth
Posts: 70
Thanks: 4
Thanked 0 Times in 0 Posts
Default Making the horizontal rule a picture - possible or not?

Hello everyone!
Is it possible to make a horizontal rule into a picture that stretches across the page horizontally and acts as a divider?
Or should I just take the picture and make the width 100%?
  #2 (permalink)  
Old April 7th, 2010, 09:51 AM
Friend of Wrox
 
Join Date: Dec 2008
Location: , , .
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
Default

Code:
<html>
<head>
<style>
hr {
  	height: 15px;
  	background: #fff url(1.jpeg);
}</style>
</head>
<body>
	foo
	<hr />
	bar
</body>
</html>
  #3 (permalink)  
Old April 7th, 2010, 10:37 AM
Registered User
 
Join Date: Apr 2010
Location: Planet Earth
Posts: 70
Thanks: 4
Thanked 0 Times in 0 Posts
Default

Quote:
Originally Posted by PeterPeiGuo View Post
Code:
<html>
<head>
<style>
hr {
  	height: 15px;
  	background: #fff url(1.jpeg);
}</style>
</head>
<body>
	foo
	<hr />
	bar
</body>
</html>
Ok thanks!
Just one question - what is the purpose of also including a color (#fff)?
  #4 (permalink)  
Old April 7th, 2010, 12:21 PM
Friend of Wrox
 
Join Date: Dec 2008
Location: , , .
Posts: 238
Thanks: 2
Thanked 20 Times in 19 Posts
Default

The color is not too useful in my previous example, but you can see its use here:
Code:
<html>
<head>
<style>
hr {
  	height: 15px;
  	background: red url(winter.jpg) no-repeat center;
}</style>
</head>
<body>
	foo
	<hr />
	bar
</body>
</html>
  #5 (permalink)  
Old April 7th, 2010, 12:26 PM
Registered User
 
Join Date: Apr 2010
Location: Planet Earth
Posts: 70
Thanks: 4
Thanked 0 Times in 0 Posts
Default

Quote:
Originally Posted by PeterPeiGuo View Post
The color is not too useful in my previous example, but you can see its use here:
Code:
<html>
<head>
<style>
hr {
  	height: 15px;
  	background: red url(winter.jpg) no-repeat center;
}</style>
</head>
<body>
	foo
	<hr />
	bar
</body>
</html>
aha that makes more sense since you centered it. Thanks!
I just implemented it onto my website. The horizontal rule now looks like an asteroid. Click here to visit the website

Last edited by andypandyrox456; April 7th, 2010 at 12:41 PM..


Similar Threads
Thread Thread Starter Forum Replies Last Post
Need help with a validation rule Hliu Access VBA 1 September 3rd, 2008 09:42 AM
Create a validation rule sheregardner Access 1 October 24th, 2006 07:00 AM
Writing Rule Problem gaurav_jain2403 SQL Server 2000 5 August 3rd, 2006 12:51 AM
CSS2: Horizontal Rule Has 1px Border in IE??? kwilliams CSS Cascading Style Sheets 4 April 27th, 2006 09:53 AM
OLE picture - accessing the picture property bdcrisp Excel VBA 0 December 7th, 2003 09:35 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.