The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

2 Pages V < 1 2  
Reply to this topicStart new topic
> hr position won't change.
pandy
post Apr 6 2019, 01:48 AM
Post #21


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,312
Joined: 9-August 06
Member No.: 6



I don't know what the others are saying, but I'm saying that you won't change the position of the HR with width and height. It will be larger or smaller but it will be in the same place.

I suggested a DIV for training because it doesn't have any special features, as HR has.


As an example...

HTML
<hr id="foo">


... if you want to move the HR a little upwards, you could use a negative top margin...

CODE
#foo    { margin-top: -10px }


...or you could use position relative.

CODE
#foo    { position: relative; top: -10px }


The difference in how this will look is that position: relative will leave a space where the HR originally was. The text after it won't move up. With a negative margin there is no space and the text after the HR will follow it up.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Apr 6 2019, 04:07 AM
Post #22


.
********

Group: WDG Moderators
Posts: 8,179
Joined: 10-August 06
Member No.: 7



QUOTE(pandy @ Apr 6 2019, 08:48 AM) *

I suggested a DIV for training because it doesn't have any special features, as HR has.

What are those special features (asking for a friend)? blush.gif

QUOTE
As an example...

HTML
<hr id="foo">


... if you want to move the HR a little upwards, you could use a negative top margin...

Then the HR may even move in front of the element above it, which can be useful sometimes.

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 6 2019, 01:13 PM
Post #23


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,312
Joined: 9-August 06
Member No.: 6



Features was maybe a poor choice of word, but a HR has default browser styling that makes it look like a HR, i.e. three dimensional. Borders, more than one shade or whatever is used. Since a div is just an anonymous box it may be easier to fiddle with.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

2 Pages V < 1 2
Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 20th July 2019 - 04:55 PM