[EdLUG] Help

[Tai Kedzierski]

Which specific example did you lift?

What did it look like originally?

My point is, the example snippet you posted is in fact incorrect.

Box:

The page you linked does not describe a "<box>" element, but a "box"
_concept_. That concept is applied both to block elements and inline
elements. The usual block level element to use in this case (although some
argue against using it in this way) is the "<div>" element.

Browsers do not understand "<box>" as it doesn't exist. This means they
cannot render any stylings you may define.


Syntax:

Your snippet also simply has CSS staements in the middle of an element
syntax. This is broken syntax. You either need to embed CSS statements in a
style="" sequence, or define a <style> block, and do proper CSS statements.

So this would be more approximately similar to what you meant to do

<style>
.box { /* note the starting "." character */
   box-sizing: content-box;
   width: 300px;
   height: 400px;
   padding: 30px;
   border: 10px solid blue;
   overflow: scroll;
}
</style>

<div class="box">
(your further content here)
</div>

I tested this in Firefox and it does render with the stylings specified.


---
Tai Kedzierski

@taikedz

https://www.meetup.com/Edinburgh-Language-Exchange/


On Fri, 11 Mar 2022 at 15:50, Andrew Ramage <andrew.ramage.1963 at gmail.com>
wrote:

> I lifted the syntax from W3Schools, modifying it for my needs.
> On 11/03/2022 15:32, Tai Kedzierski wrote:
>
> Indeed. No <box> element !
>
> You probably want <div style="border: 1px solid"> instead
>
> // Sent from a mobile device. Typos and brevity may transpire.
>
> On Fri, 11 Mar 2022, 15:19 Andrew Ramage, <andrew.ramage.1963 at gmail.com>
> wrote:
>
>>
>> https://www.w3schools.com/Css/css_boxmodel.asp#:~:text=All%20HTML%20elements%20can%20be%20considered%20as%20boxes.,Padding%20-%20Clears%20an%20area%20around%20the%20content
>> .
>> On 11/03/2022 13:59, Tai Kedzierski wrote:
>>
>> 1. I do not know of the <box> element - this probably has no meaning to
>> the rendering engine of any browsers.
>> 2. You have CSS code plainly in the element , instead of in a "style"
>> attribute, or in a <style></style> block
>>
>>
>> You might want to have a quick recap of CSS usage
>> https://www.w3schools.com/Css/css_intro.asp
>>
>>
>> ---
>> Tai Kedzierski
>>
>> @taikedz
>>
>> https://www.meetup.com/Edinburgh-Language-Exchange/
>>
>>
>> On Fri, 11 Mar 2022 at 13:46, Andrew Ramage <andrew.ramage.1963 at gmail.com>
>> wrote:
>>
>>> Can anyone tell me why I am not getting a box ?  (See
>>> www.andrewnramage.co.uk/Read.html )
>>>
>>> </center>
>>> <input type="button" onclick="goback()" value="<<">
>>> <section>
>>>    <nav>
>>>      <box   box-sizing: content-box;
>>>    width: 300px;
>>>    height: 400px;
>>>    padding: 30px;
>>>    border: 10px solid blue;
>>>    overflow: scroll;>
>>>        <table .lib>
>>>          <tr><td><a href="#r1">Storm of Fury by Jessica
>>> Gunn</a></td></tr>
>>>
>>>
>>> --
>>> EdLUG mailing list
>>> EdLUG at mailman.lug.org.uk
>>> https://lists.edlug.org.uk/mailman/listinfo/edlug
>>>
>>
>> --
>> EdLUG mailing list
>> EdLUG at mailman.lug.org.uk
>> https://lists.edlug.org.uk/mailman/listinfo/edlug
>>
>
> --
> EdLUG mailing list
> EdLUG at mailman.lug.org.uk
> https://lists.edlug.org.uk/mailman/listinfo/edlug
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.edlug.org.uk/pipermail/edlug/attachments/20220311/b5b649bd/attachment-0001.htm>