SitePoint Sponsor

User Tag List

Results 1 to 7 of 7

Thread: w3c hates me!

  1. #1
    SitePoint Member
    Join Date
    Jan 2007
    Location
    Elgin, Illinois
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question w3c hates me!

    I'm a total newbie who has been appreciating your newsletters for a long time. I'm a tech writer with verrrrrrrry little coding knowledge whose bosses keep asking me to code... please be patient with my frustration. I'm sure this problem will be way too simple for you guys, but I'm really hoping someone deigns to answer before I go insane.

    All I want to do is make a little hr that is about 1px in size that aligns to the left. I learned from w3c that inline attributes for hrs is now deprecated, and that I should use styles (which is fine, I'm slowly but surely building a little style sheet), but NOWHERE do they say how to word the attributes for hr that are appropriate for the style sheet! I've tried various things, the latest being:

    hr {
    color: #707276;
    width: 60%;
    align: left;
    margin: 0px
    size: 1px
    }

    Clearly the "size: 1px" isn't working-- that was just a stab in the dark. But why isn't the align working? I tried h-align, horizontal-align, horiz-align, but nada!

    Thank you all so much for any time you can give me. I truly appreciate it!!!
    "Fear Me!" Viking Ninja Kitten

  2. #2
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello

    text-align:center; for IE < 6 , margin:0 auto: + a Width for modern browsers , with an appropriate DTD, why use something like a hr tag ? maybe consider using a border-bottom on an existing Tag P ?

    Off Topic:


    dogs have bosses


    horizontal lines , Sorry without using existing Tags
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <title>CSS hr tag, div line</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    	<style type="text/css">
    	*{margin:0;padding:0;}
    	
    	body{font-size:75&#37;;background:#909090;}
    	
    	/* general */
    	div,p,hr{
    	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
    	font-size:1em;
    	color:#ffffff;
    	text-align:center;/*IE*/
    	margin:0 auto;
    	width:96%;
    	}
    	
    	p{padding-top:1em;text-align:left;}
    
    	.hr1{
    	background:#ff8c00;/*NS FF OP */
    	color:#ff8c00;/*IE*/
    	height:1px;/*FF NS OP*/
    	overflow:hidden;
    	}
    	
    	.hr100{
    	height:100px;
    	background:#ff8c00;/*NS FF OP */
    	color:#ff8c00;/*IE*/
    	border:10px solid #daa520;/*IE FF NS OP*/
    	}
    
    	/*div lines*/
    	div{
    	background:#ff8c00;
    	height:1px;
    	overflow:hidden;
    	margin-bottom:1em;
    	}
    
    	.ca{background:#ffffff;color:#ffffff;}
    
    	.wl{width:50%;}
    	
    	</style>
    </head>
    <body class="cf">
    
    
    <p>std. hr tags</p>
    
    <hr />
    
    <p>&nbsp;</p>
    
    <hr class="wl" />
    
    <p>hr tag 1px heigh</p>
    
    <hr class="hr1" />
    
    <p>hr tag 100px heigh + border</p>
    
    <hr class="hr100" />
    
    <p>div lines</p>
    
    <div>&nbsp;</div>
    
    <div class="wl ca"></div>
    
    <div class="wl"></div>
    
    <div class="ca"></div>
    
    <p>&nbsp;</p>
    
    
    </body>
    </html>
    Last edited by all4nerds; Aug 21, 2007 at 11:27.

  3. #3
    SitePoint Member
    Join Date
    Jan 2007
    Location
    Elgin, Illinois
    Posts
    15
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The p border won't work for what I'm doing; I'm kind of underlining the H2 tags... kind of. It's not often I feel like a moron, but I suppose it's good for me-- thanks for all that code-- I was able to make it work and my life can finally move on! Thank you so much!!!!
    "Fear Me!" Viking Ninja Kitten

  4. #4
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That needs to be font-size. But if you're trying to put a border on a heading element, why not just use the border-bottom property and get it done with?

  5. #5
    Non-Member
    Join Date
    Jan 2005
    Location
    Netherlands
    Posts
    4,300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Dan Schulz View Post
    That needs to be font-size. But if you're trying to put a border on a heading element, why not just use the border-bottom property and get it done with?
    Hello

    border bottom on exiting tags you mean ? Dan

  6. #6
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,495
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah. I'm at my brother's house right now and his computer's being a PITN (Pain In The Neck) again.

    I wish I was at home!

  7. #7
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'd go with the bottom border option if possible.

    I've not used hr's for a while but if I remember rightly to get them working cross browser you need to apply a background-color along with your color as well as supplying a height: 1px; and a border: 0;

    so...

    Code:
    hr {
    color: #707276;
    background-color: #707276;
    width: 60&#37;;
    margin: 0px;
    height: 1px
    border: 0;
    }
    Some of these may have been used for IE5 and as far back as Netscape 4.2 so you may not need all of the value anymore.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •