- From: Steve Comstock <steve@trainersfriend.com>
- Date: Sat, 8 Aug 2020 21:15:02 -0600
- To: Marat Tanalin <mtanalin@yandex.ru>, Ian Hickson <ian@hixie.ch>, Anne van Kesteren <notifications@github.com>, "annevk@opera.com" <annevk@opera.com>, Simon Pieters <simonp@opera.com>, Ian Jacobs <ij@w3.org>, Mark Davis ⚖ <markdavis@google.com>, Bert Bos <bert@w3.org>, Léonie Watson <tink@tink.uk>, Scott O'Hara <sohara@paciellogroup.com>, "patricia@vivaldi.com" <patricia@vivaldi.com>, "shwetank@barrierbreak.com" <shwetank@barrierbreak.com>, "terence.eden@digital.cabinet-office.gov.uk" <terence.eden@digital.cabinet-office.gov.uk>, "bruce@brucelawson.co.uk" <bruce@brucelawson.co.uk>, "sangwhan@iki.fi" <sangwhan@iki.fi>, "xiaoqian@w3.org" <xiaoqian@w3.org>
- Cc: "public-html-comments@w3.org" <public-html-comments@w3.org>
On 8/8/2020 4:47 PM, Marat Tanalin wrote:
> Some other styles on your page apparently have higher specificity than your class.
> Inline styles (`style="..."`) have highest specificity (except styles with
> `!important`), that's most likely why they work while class styles don't.
Yes, one would think that, wouldn't one?
But the structure is simple:
<body>
* font-family: Arial, sans-serif;
<div class=contentContainer>
* display: block; position: relative; clear: both;
margin: 0px; padding: 0px;
<div class=contentColumn>
* margin: 5px 4px 4px 18%; width: 80%;
<div class=Rlinearound>
* margin-left: 6em; width: 60%;
border: black 2px solid;
padding: 12px; border-radius: 1em;
Kind regards,
-Steve
> 08.08.2020, 23:37, "Steve Comstock" <steve@trainersfriend.com>:
>
> Well I've had a very unsettling experience, although
> I'm sure the keepers of the standards and the code
> can clarify what's happening.
>
>
> Basically, I had a paragraph in an HTML document that
> I wanted to have indented, less than full width, with
> a border around it, with rounded corners. Seems, well,
> not totally simple but, straightforward.
>
>
> But what occurred was:
>
> * If I created a class with the properties I want
> (I called it "Rlinearound") and then coded a
> <div class="Rlinearound"> element, it was ignored
>
> * If I changed the <div> element to use a style
> attribute instead (with the exact same set of
> properites), it worked
>
>
> I've attached some images of the various pieces
>
> * StyleDef.jpg shows the class defintion
>
> * UseClass.jpg shows the code using the <div class=
>
> * ResultUsingClass.jpg shows the result when I used
> the <div class= version
>
> * UseStyle.jpg shows the code using <div style=
>
> * ResultUsingStyle.jpg shows the result when I used
> the <div style= version
>
>
> So, I've ended up with the result I wanted, but I am
> totally baffled why using class= did not work, and I'd
> like to understand what's going on.
>
>
> Current Windows 10, current Firefox.
>
>
> Thanks in advance for any guidance / suggestions / answers
> you can give me. I'm more than willing to try some
> experiments, and I've tried quite a few so far, I just
> can't figure this out.
>
>
> Kind regards,
>
>
> -Steve Comstock
>
>
Received on Sunday, 9 August 2020 03:15:40 UTC