Solved

Can't position my <HR> tag

Posted on 2011-03-02
6
345 Views
Last Modified: 2012-05-11
    I have this simple CSS document which has an endnote section at the bottom. I have this horizontal rule (horizontal line) that precedes the endnote. I want to position the line so that it's all the way to the left, but instead its centered and I can't figure out why. Can somebody please check the code and see why?
     Also, I want the line to be about one quarter the length of the screen. I specified its size in "em," but I'm not sure if there is a better method (like using pixels or percentages). I'm kind of fuzzy when trying to determine whether to use em's, pixels or percentages (or any other methods) when specifying sizes. Can anybody give me some pointers? HRtag.htm
0
Comment
Question by:john8217
6 Comments
 
LVL 19

Accepted Solution

by:
daveamour earned 125 total points
ID: 35018071
try this:

<div class="endnote" style="text-align: left;">
0
 
LVL 19

Expert Comment

by:daveamour
ID: 35018082
Ps - this for the width:

<hr width="25%" noshade>
0
 
LVL 19

Assisted Solution

by:Bardobrave
Bardobrave earned 125 total points
ID: 35018184
Percentages are better suited for object measures, while "em"s are better suited for font sizes.

Both are dinamyc measure units, as they will adjust depending on external features (as container's window size or SO's font size preferences).

Pixels can be used for objects and fonts, but the measures you define in pixels are FIXED and won't be able to "autoadjust" dinamycally.

0
Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

 
LVL 5

Expert Comment

by:h4mi
ID: 35018213
.endnote
{
   position:relative;
   margin-left:0%;
}
.endnote hr
{
   text-align:left;
}
0
 

Expert Comment

by:userboy87
ID: 35019075
If you don't mind conditional comments to circumvent IE < 8 weirdness...

<style type="text/css">
  .endnote hr {
    display: inline-block;
    width: 25%;
    margin-left: 0;
  }
</style>
<!--[if lte IE 7]>
<style type="text/css">
  .endnote hr {
    display: block;
    float: left;
    margin-bottom: -1em;
  }
</style>
<![endif]-->
0
 

Author Closing Comment

by:john8217
ID: 35020342
Thanks
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Issue in webpage 6 34
Full Screen problem when auto scale IFRAME 2 65
Change color of modular 8 22
How to loop bootstrap columns which contain database records 9 23
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

896 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now