/    Sign up×
Community /Pin to ProfileBookmark

Inline <hr>

Copy linkTweet thisAlerts:
Jul 04.2003

I was messing around with applying some different CSS properties to the <hr> element, and I was trying to get them so that you could have more than one on a line. I tried using the [FONT=courier new]display:inline[/FONT] property, but that doesn’t work in IE. Anyone have any ideas???

to post a comment
CSS

10 Comments(s) ↴

Copy linkTweet thisAlerts:
@DaveSWJul 04.2003 — Can you explain a bit more please?
Copy linkTweet thisAlerts:
@hastxJul 04.2003 — Do you mean like having 2 or 3 lined up horizontally on the same line with different properties?
Copy linkTweet thisAlerts:
@DaveSWJul 04.2003 — You could try a span - width 50% height 2px. and then another span etc.
Copy linkTweet thisAlerts:
@ExuroauthorJul 04.2003 — Okay, what I did was made the <hr>s 2px wide and 1em tall. I wanted to have like 5 of them on the same line separating a bunch of text. Unfortunately, <hr> has an automatic line break before and after it, so it isn't working. I wanted to know if there was a way to get rid of that line break with CSS.
Copy linkTweet thisAlerts:
@DaveSWJul 04.2003 — absolute positioning?
Copy linkTweet thisAlerts:
@David_HarrisonJul 05.2003 — Absolute positioning won't work because different browsers leave different spaces above the hr before the hr itself. I say spaces because it isn't a margin or border as I set them to 0 to try and get rid of it but it didn't work.

I tried putting them in a div and positioning that and that worked in IE and Opera but not Netscape, it still had the space.
Copy linkTweet thisAlerts:
@Kr_ZJul 05.2003 — Create the lines with a table instead
Copy linkTweet thisAlerts:
@nkaisareJul 05.2003 — You may want to use an image instead. Don't add 5 <hr>, sematically they make no sense.
Copy linkTweet thisAlerts:
@toicontienJul 05.2003 — If you [i]really[/i] want to use HR's, you should be able to modify the padding and margins using CSS. I've attached a file with an example. I was able to get rid of the line breaks after the HRs.

Lemme know if that's what you're after.

[upl-file uuid=679bf8ec-175c-47df-abfe-701e88d4d470 size=609B]hr_test.txt[/upl-file]
Copy linkTweet thisAlerts:
@David_HarrisonJul 05.2003 — erm... you might want to work on your script a little:

  • * IE 6 just display's the text, then on a new line an hr then on a new line another hr etc.


  • * Opera 7 just display's the text and nothing else.


  • * Netscape 7 display's the text by itself and joins the hr's end to end on another line.
    • ×

    Success!

    Help @Exuro spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 6.2,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @meenaratha,
    tipped: article
    amount: 1000 SATS,

    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,
    )...