• tabs and indentation?

    From Dale@21:1/5 to All on Sun Mar 13 04:28:00 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    I know how to do alignment to the center, right, and left.

    how do I do tabs and indentation?

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and Paragraph without <br>

    how can I get rid of that space?


    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Philip Herlihy@21:1/5 to All on Sun Mar 13 11:49:50 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In article <MPG.3c97e3f5f6fe31e69899b3@news.eternal-september.org>, thiswillbounceback@you.com says...

    In article <t0k9ui$vi1$1@dont-email.me>, dale@dalekelly.org says...

    I know how to do alignment to the center, right, and left.

    how do I do tabs and indentation?

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and Paragraph without <br>

    how can I get rid of that space?

    Further to my previous response in another thread:

    Randomly asking questions is a very inefficient way to learn how to build web pages (for everyone). You need to read up on HTML and CSS. Your question isn't even at a decent beginner level - it's what your Gran might ask.

    A browser lays out HTML according to CSS stylesheets, including a default one built-in. That will set, for example, the 'margin' and 'padding' of various elements, unless superseded by a custom stylesheet (which is usual).

    Linkedin has very good tutorial videos for a monthly fee - formerly the excellent Lynda.com. You may also find good stuff on YouTube.


    Try this:

    https://www.w3schools.com/

    --

    Phil, London

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Dale on Sun Mar 13 12:06:08 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    Dale <dale@dalekelly.org> writes:
    I know how to do alignment to the center, right, and left.
    how do I do tabs and indentation?

    Indentation can be controlled via CSS. Some elements,
    especially entries of lists, are usually indented.
    Sometimes, tables might be used for indentation.

    A CSS property that comes to mind is: margin-left.
    Disclaimer: I don't know much about CSS.

    Browser tabs can be recreated to some extend within
    a web page using both JavaScript and CSS.

    notice the space between Header and Paragraph without <br>
    how can I get rid of that space?

    Using CSS.

    Some CSS properties that come to mind are: margin-top,
    padding-top, line-height, margin-bottom, border-width.

    Of course, Philip is right insofar as it would help you
    to read some good books about HTML, CSS, and JavaScript.
    (Unfortunately, I cannot think of any specific recommended
    books now.)

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Philip Herlihy@21:1/5 to All on Sun Mar 13 11:53:41 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In article <MPG.3c97eabcecb239a99899b4@news.eternal-september.org>, thiswillbounceback@you.com says...

    In article <MPG.3c97e3f5f6fe31e69899b3@news.eternal-september.org>, thiswillbounceback@you.com says...

    In article <t0k9ui$vi1$1@dont-email.me>, dale@dalekelly.org says...

    I know how to do alignment to the center, right, and left.

    how do I do tabs and indentation?

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and Paragraph without <br>

    how can I get rid of that space?

    Further to my previous response in another thread:

    Randomly asking questions is a very inefficient way to learn how to build web
    pages (for everyone). You need to read up on HTML and CSS. Your question isn't even at a decent beginner level - it's what your Gran might ask.

    A browser lays out HTML according to CSS stylesheets, including a default one
    built-in. That will set, for example, the 'margin' and 'padding' of various
    elements, unless superseded by a custom stylesheet (which is usual).

    Linkedin has very good tutorial videos for a monthly fee - formerly the excellent Lynda.com. You may also find good stuff on YouTube.


    Try this:

    https://www.w3schools.com/

    And, if you want your mind blown: have a look at this: https://en.wikipedia.org/wiki/CSS_Zen_Garden

    --

    Phil, London

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Philip Herlihy@21:1/5 to All on Sun Mar 13 11:21:06 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In article <t0k9ui$vi1$1@dont-email.me>, dale@dalekelly.org says...

    I know how to do alignment to the center, right, and left.

    how do I do tabs and indentation?

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and Paragraph without <br>

    how can I get rid of that space?

    Further to my previous response in another thread:

    Randomly asking questions is a very inefficient way to learn how to build web pages (for everyone). You need to read up on HTML and CSS. Your question isn't even at a decent beginner level - it's what your Gran might ask.

    A browser lays out HTML according to CSS stylesheets, including a default one built-in. That will set, for example, the 'margin' and 'padding' of various elements, unless superseded by a custom stylesheet (which is usual).

    Linkedin has very good tutorial videos for a monthly fee - formerly the excellent Lynda.com. You may also find good stuff on YouTube.

    --

    Phil, London

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Stefan Ram on Sun Mar 13 12:27:01 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    ram@zedat.fu-berlin.de (Stefan Ram) writes:
    (Unfortunately, I cannot think of any specific recommended
    books now.)

    They may be a bit dated today, but books I liked at one point include:

    Learning Web Design, Jennifer Robbins
    CSS Pocket Reference, Eric Meyer
    HTML5 for Masterminds, Juan Gauchat
    Learning JavaScript, Tim Wright
    Modern JavaScript, Larry Ullman

    .

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Philip Herlihy on Sun Mar 13 08:54:58 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 7:49 AM, Philip Herlihy wrote:
    Try this:

    https://www.w3schools.com/


    I have been. Around 30 years ago it had pop-ups and W3.org didn't.

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Stefan Ram on Sun Mar 13 08:59:20 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 8:27 AM, Stefan Ram wrote:
    ram@zedat.fu-berlin.de (Stefan Ram) writes:
    (Unfortunately, I cannot think of any specific recommended
    books now.)

    They may be a bit dated today, but books I liked at one point include:

    Learning Web Design, Jennifer Robbins
    CSS Pocket Reference, Eric Meyer
    HTML5 for Masterminds, Juan Gauchat
    Learning JavaScript, Tim Wright
    Modern JavaScript, Larry Ullman

    .



    Don't want JavaScript or cookies.

    I really like learning videos.

    I have a look at youtube and wondrium

    https://wondrium.com/

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Stefan Ram on Sun Mar 13 14:08:20 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    ram@zedat.fu-berlin.de (Stefan Ram) writes:
    Maybe one could use pseudo class selectors (like ":checked")
    to implement tabs with CSS only.

    Maybe something like the following?

    <!DOCTYPE html><html>
    <head><meta charset="UTF-8" /><title></title><style type="text/css">
    label { padding: 5px 20px 5px 20px; border: 1px solid #CCC }
    input, p { display: none; }
    input:checked + p { display: block; }
    </style></head><body>
    <label for='button0'>0</label>
    <label for='button1'>1</label>
    <label for='button2'>2</label>
    <input id='button0' name='radio' type='radio' />
    <input id='button1' name='radio' type='radio' /><p>paragraph 1</p>
    <input id='button2' name='radio' type='radio' /><p>paragraph 2</p>
    </body></html>

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Dale on Sun Mar 13 13:24:08 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    Dale <dale@dalekelly.org> writes:
    Don't want JavaScript or cookies.

    Maybe one could use pseudo class selectors (like ":checked")
    to implement tabs with CSS only.

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Jukka K. Korpela@21:1/5 to Dale on Sun Mar 13 16:43:36 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    Dale wrote:

    how do I do tabs and indentation?

    No idea. You need to explain what you want, instead of mentioning (very vaguely) assumed solutions to unspecified problems. In particular, “tab” can mean a dozen things, or more.

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and  Paragraph without <br>

    how can I get rid of that space?


    This was an easy one. The spacing is caused by default vertical margins
    for elements. Put this into your <head>:

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Stefan Ram on Sun Mar 13 12:59:52 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 10:08 AM, Stefan Ram wrote:
    ram@zedat.fu-berlin.de (Stefan Ram) writes:
    Maybe one could use pseudo class selectors (like ":checked")
    to implement tabs with CSS only.

    Maybe something like the following?

    <!DOCTYPE html><html>
    <head><meta charset="UTF-8" /><title></title><style type="text/css"> label { padding: 5px 20px 5px 20px; border: 1px solid #CCC }
    input, p { display: none; }
    input:checked + p { display: block; }
    </style></head><body>
    <label for='button0'>0</label>
    <label for='button1'>1</label>
    <label for='button2'>2</label>
    <input id='button0' name='radio' type='radio' />
    <input id='button1' name='radio' type='radio' /><p>paragraph 1</p>
    <input id='button2' name='radio' type='radio' /><p>paragraph 2</p>
    </body></html>



    looks very nice but not what I amm looking for

    Thank You!!!!

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Jukka K. Korpela on Sun Mar 13 13:09:37 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 10:43 AM, Jukka K. Korpela wrote:
    Dale wrote:

    how do I do tabs and indentation?

    No idea. You need to explain what you want, instead of mentioning (very vaguely) assumed solutions to unspecified problems. In particular, “tab” can mean a dozen things, or more.

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and  Paragraph without <br>

    how can I get rid of that space?


    This was an easy one. The spacing is caused by default vertical margins
    for elements. Put this into your <head>:

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>


    still has a line between them

    <!DOCTYPE html>

    <html>

    <head>

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>

    </head>


    <body>

    <h1>test</h1>
    <p>test</p>

    </body>

    </html>

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Dale on Sun Mar 13 17:15:47 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    Dale <dale@dalekelly.org> writes:
    h1 { margin-bottom: 0: }

    "0:" is not a valid value for "margin-bottom". Try "0ex".

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Jukka K. Korpela on Sun Mar 13 17:21:57 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    "Jukka K. Korpela" <jukkakk@gmail.com> writes:
    Put this into your <head>:

    Nice pun!

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>

    Maybe you wanted to type a semicolon instead of a colon
    in both cases.

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Jukka K. Korpela@21:1/5 to Stefan Ram on Sun Mar 13 20:26:10 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    Stefan Ram wrote:

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>
    Maybe you wanted to type a semicolon instead of a colon
    in both cases.

    Yes, thanks for pointing this out. (Now, who invented a keyboard where
    “,” and “.” are adjacent as well as “;” and “:”?)

    (By the way, a CSS validator would have pointed out that there is some
    syntax error. Sorry for not checking the code before posting.)

    (The value 0 is correct. This value can be used alone, without any unit,
    since 0 times anything is 0. Well, that’s the rationale; the formal
    point is that CSS specifications make this a rule.)

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Lewis@21:1/5 to Philip Herlihy on Sun Mar 13 18:47:49 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In message <MPG.3c97eabcecb239a99899b4@news.eternal-september.org> Philip Herlihy <thiswillbounceback@you.com> wrote:
    https://www.w3 schools.com/

    Let's not recommend w3 schools, it is a mess.

    --
    Cheer up Keeley, it's a funeral.

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From David E. Ross@21:1/5 to Dale on Sun Mar 13 12:30:22 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 12:28 AM, Dale wrote:
    I know how to do alignment to the center, right, and left.

    how do I do tabs and indentation?

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and Paragraph without <br>

    how can I get rid of that space?

    To indent the first line of a paragraph, see <https://www.w3.org/TR/CSS22/selector.html#first-line-pseudo>.

    --
    David E. Ross
    "A Message to Those Who Are Not Vaccinated"
    See my <http://www.rossde.com/index.html#vaccine>.

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Lewis on Sun Mar 13 15:52:56 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 2:47 PM, Lewis wrote:
    In message <MPG.3c97eabcecb239a99899b4@news.eternal-september.org> Philip Herlihy <thiswillbounceback@you.com> wrote:
    https://www.w3 schools.com/

    Let's not recommend w3 schools, it is a mess.


    30 years or so ago it had a lot of pop-ups

    I used just W3.org

    now W3Schools is great!

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Stefan Ram on Sun Mar 13 15:51:06 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 1:21 PM, Stefan Ram wrote:
    "Jukka K. Korpela" <jukkakk@gmail.com> writes:
    Put this into your <head>:

    Nice pun!

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>

    Maybe you wanted to type a semicolon instead of a colon
    in both cases.



    Thank You! Got it to work!

    <style>
    h1 { margin-bottom: 0; }
    h1 + p { margin-top: 0; }
    </style>

    Now I am left to find out how to indent the <p> under the <h1>

    and add a style to make <p> larger on smart phones and tablets.

    My CSS adjusts for position of menus.

    I don't want to put the styles above in my CSS for the layout of pages
    are sometimes different. I guess I could have different CSS for
    different groups of pages.

    Can I just add this to a CSS?


    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to David E. Ross on Sun Mar 13 15:54:15 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 3:30 PM, David E. Ross wrote:
    On 3/13/2022 12:28 AM, Dale wrote:
    I know how to do alignment to the center, right, and left.

    how do I do tabs and indentation?

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and Paragraph without <br>

    how can I get rid of that space?

    To indent the first line of a paragraph, see <https://www.w3.org/TR/CSS22/selector.html#first-line-pseudo>.


    Going to require some study. Thank you though!

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Dale on Sun Mar 13 16:06:43 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 1:09 PM, Dale wrote:
    On 3/13/2022 10:43 AM, Jukka K. Korpela wrote:
    Dale wrote:

    how do I do tabs and indentation?

    No idea. You need to explain what you want, instead of mentioning
    (very vaguely) assumed solutions to unspecified problems. In
    particular, “tab” can mean a dozen things, or more.

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and  Paragraph without <br>

    how can I get rid of that space?


    This was an easy one. The spacing is caused by default vertical
    margins for elements. Put this into your <head>:

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>


    still has a line between them

    <!DOCTYPE html>

        <html>

            <head>

                <style>
                    h1 { margin-bottom: 0: }
                    h1 + p { margin-top: 0: }
                </style>

            </head>


            <body>

                <h1>test</h1>
                <p>test</p>

            </body>

        </html>



    Doesn't work with <h3>

    <style>
    h3 { margin-bottom: 0; }
    h3 + p { margin-top: 0; }
    </style>



    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Dale on Sun Mar 13 16:13:02 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 4:06 PM, Dale wrote:
    On 3/13/2022 1:09 PM, Dale wrote:
    On 3/13/2022 10:43 AM, Jukka K. Korpela wrote:
    Dale wrote:

    how do I do tabs and indentation?

    No idea. You need to explain what you want, instead of mentioning
    (very vaguely) assumed solutions to unspecified problems. In
    particular, “tab” can mean a dozen things, or more.

    also, when I do something like this

    <h1>Header</h1>
    <p>Paragraph</p>

    I get this ...

    Header

    Paragraph



    notice the space between Header and  Paragraph without <br>

    how can I get rid of that space?


    This was an easy one. The spacing is caused by default vertical
    margins for elements. Put this into your <head>:

    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>


    still has a line between them

    <!DOCTYPE html>

         <html>

             <head>

                 <style>
                     h1 { margin-bottom: 0: }
                     h1 + p { margin-top: 0: }
                 </style>

             </head>


             <body>

                 <h1>test</h1>
                 <p>test</p>

             </body>

         </html>



    Doesn't work with <h3>

        <style>
            h3 { margin-bottom: 0; }
            h3 + p { margin-top: 0; }
        </style>





    sorry ...

    had this ...

    <h1>test</h1>
    <p>test</p>

    instead of this ...

    <h3>test</h3>
    <p>test</p>

    Thank You!!!!

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From John-Paul Stewart@21:1/5 to David E. Ross on Sun Mar 13 16:04:38 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 2022-03-13 15:30, David E. Ross wrote:

    To indent the first line of a paragraph, see https://www.w3.org/TR/CSS22/selector.html#first-line-pseudo

    Or simply use the text-indent property:

    https://www.w3.org/TR/CSS22/text.html#indentation-prop

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Lewis@21:1/5 to Philip Herlihy on Sun Mar 13 22:15:56 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In message <MPG.3c97eabcecb239a99899b4@news.eternal-september.org> Philip Herlihy <thiswillbounceback@you.com> wrote:
    https://www.w3 schools.com/

    Let's not recommend w3 schools, it is a mess.

    --
    Cheer up Keeley, it's a funeral.

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Lewis@21:1/5 to Stefan Ram on Mon Mar 14 00:33:19 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In message <0ex-20220313181520@ram.dialup.fu-berlin.de> Stefan Ram <ram@zedat.fu-berlin.de> wrote:
    Dale <dale@dalekelly.org> writes:
    h1 { margin-bottom: 0: }

    "0:" is not a valid value for "margin-bottom". Try "0ex".

    0 is perfectly fine, you do not need to specify px or ex or pt or em
    with 0; the problem is that it should be:

    #v+
    h1 { margin-bottom: 0; }
    h1 + p { margin-top: 0; }
    #v-

    (NB: semicolons at the end of the CSS statement).

    And yes, you do have to use both since the default styling for both H
    and P tags includes the margin.

    --
    '(...) And the Patrician has been ironical at me,' said Mr. Clete.
    'I'm not having that again.'

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Lewis@21:1/5 to Stefan Ram on Mon Mar 14 00:24:25 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In message <CSS-20220313150742@ram.dialup.fu-berlin.de> Stefan Ram <ram@zedat.fu-berlin.de> wrote:
    ram@zedat.fu-berlin.de (Stefan Ram) writes:
    Maybe one could use pseudo class selectors (like ":checked")
    to implement tabs with CSS only.

    Maybe something like the following?

    <!DOCTYPE html><html>
    <head><meta charset="UTF-8" /><title></title><style type="text/css"> label { padding: 5px 20px 5px 20px; border: 1px solid #CCC }
    input, p { display: none; }
    input:checked + p { display: block; }
    </style></head><body>
    <label for='button0'>0</label>
    <label for='button1'>1</label>
    <label for='button2'>2</label>
    <input id='button0' name='radio' type='radio' />
    <input id='button1' name='radio' type='radio' /><p>paragraph 1</p>
    <input id='button2' name='radio' type='radio' /><p>paragraph 2</p>
    </body></html>

    That works perefectly if what you need to display on the tab is simple,
    but not so well if you needed to display formatted HTML incolving more
    than a few tags.

    But it is a start.


    --
    Try to realize it's all within yourself/No one else can make you
    change

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Dale@21:1/5 to Lewis on Sun Mar 13 20:50:21 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    On 3/13/2022 8:41 PM, Lewis wrote:
    In message <t0lhvb$nsf$1@dont-email.me> Dale <dale@dalekelly.org> wrote:
    Now I am left to find out how to indent the <p> under the <h1>

    h1 + p:first-line { text-indent; 5em;}

    IIRC.

    and add a style to make <p> larger on smart phones and tablets.

    If you use em (as you should) you needn't do this.


    https://www.w3schools.com/w3css/w3css_templates.asp

    is this what you are referring to?

    --
    Mystery? -> https://www.dalekelly.org/

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Lewis@21:1/5 to Dale on Mon Mar 14 00:41:14 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In message <t0lhvb$nsf$1@dont-email.me> Dale <dale@dalekelly.org> wrote:
    Now I am left to find out how to indent the <p> under the <h1>

    h1 + p:first-line { text-indent; 5em;}

    IIRC.

    and add a style to make <p> larger on smart phones and tablets.

    If you use em (as you should) you needn't do this.

    --
    'That's blasphemy,' said the vampire. He gasped as Vimes shot him a
    glance like sunlight. 'That's what people say when the voiceless
    speak.'

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Lewis@21:1/5 to Dale on Mon Mar 14 04:53:19 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In message <t0m3gf$7k1$1@dont-email.me> Dale <dale@dalekelly.org> wrote:
    On 3/13/2022 8:41 PM, Lewis wrote:
    In message <t0lhvb$nsf$1@dont-email.me> Dale <dale@dalekelly.org> wrote:
    Now I am left to find out how to indent the <p> under the <h1>

    h1 + p:first-line { text-indent; 5em;}

    IIRC.

    and add a style to make <p> larger on smart phones and tablets.

    If you use em (as you should) you needn't do this.


    https://www.w3schools.com/w3css/w3css_templates.asp

    is this what you are referring to?

    I doubt it, I've never knowingly referred to anything on w3schools as I consider it a shit site filled with shit advice and quite often wrong information. I miss the days when Google allowed you to mark a site t
    never come up in search results.


    --
    "Are you pondering what I'm pondering?"
    "I think so, Brain, but I didn’t know 90210 was a real zip code! Will
    Tori be there?"

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Philip Herlihy@21:1/5 to All on Mon Mar 14 10:21:20 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    In article <slrnt2sr8s.rml.g.kreme@zephyrus.local>, g.kreme@kreme.dont-email.me says...

    In message <MPG.3c97eabcecb239a99899b4@news.eternal-september.org> Philip Herlihy <thiswillbounceback@you.com> wrote:
    https://www.w3 schools.com/

    Let's not recommend w3 schools, it is a mess.

    Much improved in (not-so) recent years. Our friend would do better to spend his time there than here.

    --

    Phil, London

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Jukka K. Korpela on Tue Mar 15 11:38:32 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    Supersedes: <CSS-20220315122741@ram.dialup.fu-berlin.de>
    ["ion,"->"ion;" - English requires a semicolon here!]

    "Jukka K. Korpela" <jukkakk@gmail.com> writes:
    Stefan Ram wrote:
    <style>
    h1 { margin-bottom: 0: }
    h1 + p { margin-top: 0: }
    </style>
    Maybe you wanted to type a semicolon instead of a colon
    in both cases.
    Yes, thanks for pointing this out. (Now, who invented a keyboard where >“,” and “.” are adjacent as well as “;” and “:”?)

    I'm sure you realize this, but I'm just saying it for the
    sake of other readers:

    In CSS, the semicolon does /not/ terminate a declaration;
    it /separates/ declarations within a ruleset.

    ruleset : selector? '{' S* declaration? [ ';' S* declaration? ]* '}' S*;

    Therefore, if a ruleset has just a single declaration,
    no semicolon is required.

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Stefan Ram@21:1/5 to Jukka K. Korpela on Tue Mar 15 18:10:53 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    "Jukka K. Korpela" <jukkakk@gmail.com> writes: Why make similar
    characters like “.” and “,” adjacent? Regarding “:” and “;”, the US

    On some versions of Microsoft® Windows, one can edit the
    registry string

    HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Keyboard Layout

    to remap keys and use AutoHotkey to further customize the
    keyboard. Some keyboards allow to physically swap keycaps
    to adapt the keyboard to the change. One can try to relabel
    keycaps tinker style. Of course, there always is the risk
    of breaking something while doing such interventions.

    Many Linux distributions also allow remapping of keys.

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Jukka K. Korpela@21:1/5 to Stefan Ram on Tue Mar 15 19:57:40 2022
    XPost: alt.html, comp.infosystems.www.authoring.stylesheets

    Stefan Ram wrote:

    "Jukka K. Korpela" <jukkakk@gmail.com> writes:
    - -
    (Now, who invented a keyboard where
    “,” and “.” are adjacent as well as “;” and “:”?)

    I'm sure you realize this, but I'm just saying it for the
    sake of other readers:

    In CSS, the semicolon does /not/ terminate a declaration,
    it /separates/ declarations within a ruleset.

    ruleset : selector? '{' S* declaration? [ ';' S* declaration? ]* '}' S*;

    Therefore, if a ruleset has just a single declaration,
    no semicolon is required.

    Yes, I see your point about the redundancy of semicolons in the case given.

    Yet, I’m used to ending CSS declarations (as well as statements in some programming languages that have similar rules) with a semicolon, just
    for simplicity and for being prepared to adding a new declaration (or
    statament or whatever).

    But it seems that I’m getting too old for that. And my (rather off-topic
    and rhetoric) question was about keyboard design. Why make similar
    characters like “.” and “,” adjacent? Regarding “:” and “;”, the US (and
    UK) keyboards are more sensible than Finnish keyboards (where they are
    in adjacent keys, with Shift), given the rather different uses but
    similar appearance, both in (human) languages and computer codes such as
    HTML and CSS. Why would you make it easier to people in err in things
    like that, so that slight mistyping results in characters that look too
    similar but are quite different in meaning?

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)