CSS: having line break before but not after an element

Discussion in 'HTML' started by Martin Magnusson, May 25, 2005.

  1. Hi.

    I'm trying to modify a header tag to have a line break before the header
    (like display:block would do and like headers normally behave), but not
    after (like display:inline would do).

    How can I do this with CSS?
     
    Martin Magnusson, May 25, 2005
    #1
    1. Advertising

  2. Martin Magnusson

    Sid Ismail Guest

    On Wed, 25 May 2005 10:48:25 +0200, Martin Magnusson
    <> wrote:

    : Hi.
    :
    : I'm trying to modify a header tag to have a line break before the header
    : (like display:block would do and like headers normally behave), but not
    : after (like display:inline would do).
    :
    : How can I do this with CSS?


    top style-
    ..header1 {margin-top:6px; margin-bottom:1px;
    font-size:180%; font-weight:bold;}

    then,
    <div class=header1>bla bla bla</div>


    Sid
     
    Sid Ismail, May 25, 2005
    #2
    1. Advertising

  3. Sid Ismail wrote:
    > On Wed, 25 May 2005 10:48:25 +0200, Martin Magnusson
    > <> wrote:
    >
    > : Hi.
    > :
    > : I'm trying to modify a header tag to have a line break before the header
    > : (like display:block would do and like headers normally behave), but not
    > : after (like display:inline would do).
    > :
    > : How can I do this with CSS?
    >
    >
    > top style-
    > .header1 {margin-top:6px; margin-bottom:1px;
    > font-size:180%; font-weight:bold;}
    >
    > then,
    > <div class=header1>bla bla bla</div>


    I would rather modify <h4> directly, instead of having to use different
    types of divs etc. And using
    h4{
    margin-top:6px;
    margin-bottom:1px;
    }
    still makes the browsers I've tried line break after the </h4>. Is there
    any way to prevent that?
     
    Martin Magnusson, May 25, 2005
    #3
  4. Martin Magnusson

    Steve Pugh Guest

    Martin Magnusson <> wrote:

    >I'm trying to modify a header tag to have a line break before the header
    >(like display:block would do and like headers normally behave), but not
    >after (like display:inline would do).
    >
    >How can I do this with CSS?


    The closest is display: run-in
    http://www.w3.org/TR/CSS21/visuren.html#run-in

    The technicalities are bit complex and I've never used it myself so
    I;m not sure about browser support.

    Steve

    --
    "My theories appal you, my heresies outrage you,
    I never answer letters and you don't like my tie." - The Doctor

    Steve Pugh <> <http://steve.pugh.net/>
     
    Steve Pugh, May 25, 2005
    #4
  5. Martin Magnusson

    Spartanicus Guest

    Steve Pugh <> wrote:

    >The closest is display: run-in
    >http://www.w3.org/TR/CSS21/visuren.html#run-in
    >
    >The technicalities are bit complex and I've never used it myself so
    >I;m not sure about browser support.


    Supported by Opera and KHTML browsers, not by Gecko based browsers and
    IE.

    --
    Spartanicus
     
    Spartanicus, May 25, 2005
    #5
  6. Steve Pugh wrote:
    > Martin Magnusson <> wrote:
    >
    >
    >>I'm trying to modify a header tag to have a line break before the header
    >>(like display:block would do and like headers normally behave), but not
    >>after (like display:inline would do).
    >>
    >>How can I do this with CSS?

    >
    >
    > The closest is display: run-in
    > http://www.w3.org/TR/CSS21/visuren.html#run-in
    >
    > The technicalities are bit complex and I've never used it myself so
    > I;m not sure about browser support.
    >
    > Steve
    >



    Great, that's what I was looking for, but I couldn't find it at W3Schools.
     
    Martin Magnusson, May 25, 2005
    #6
  7. Martin Magnusson

    Steve Pugh Guest

    Martin Magnusson <> wrote:
    >Steve Pugh wrote:
    >> Martin Magnusson <> wrote:
    >>
    >>>I'm trying to modify a header tag to have a line break before the header
    >>>(like display:block would do and like headers normally behave), but not
    >>>after (like display:inline would do).
    >>>
    >>>How can I do this with CSS?

    >>
    >>
    >> The closest is display: run-in
    >> http://www.w3.org/TR/CSS21/visuren.html#run-in
    >>
    >> The technicalities are bit complex and I've never used it myself so
    >> I;m not sure about browser support.

    >
    >Great, that's what I was looking for, but I couldn't find it at W3Schools.


    W3Schools is very IE-centric (and hence rather limited) as well as
    being rather error prone, better to check the actual CSS specs at
    w3c.org.

    Steve

    --
    "My theories appal you, my heresies outrage you,
    I never answer letters and you don't like my tie." - The Doctor

    Steve Pugh <> <http://steve.pugh.net/>
     
    Steve Pugh, May 25, 2005
    #7
  8. Martin Magnusson

    Mark Parnell Guest

    Previously in alt.html, Martin Magnusson <>
    said:

    > I'm trying to modify a header tag to have a line break before the header
    > (like display:block would do and like headers normally behave), but not
    > after (like display:inline would do).


    ISTM that everyone is trying to make it more complicated than it should
    be. Isn't this basically what float is for? Setting float: left; on the
    heading seems to do the trick (with an appropriate width, of course).
    You may need to play with clears/margins on the surrounding elements,
    depending on context.

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    alt.html FAQ :: http://html-faq.com/
     
    Mark Parnell, May 26, 2005
    #8
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. python
    Replies:
    7
    Views:
    320
    Bruno Desthuilliers
    Jun 3, 2006
  2. Ground21
    Replies:
    24
    Views:
    784
    kwikius
    Feb 26, 2007
  3. stephpom
    Replies:
    3
    Views:
    659
    stephpom
    Aug 30, 2007
  4. Mike

    Line break in WML but not XHTML

    Mike, Apr 18, 2005, in forum: ASP .Net Mobile
    Replies:
    0
    Views:
    133
  5. John Smith
    Replies:
    1
    Views:
    110
    kaeli
    Jul 23, 2003
Loading...

Share This Page