Asked  7 Months ago    Answers:  5   Viewed   36 times

I avoid using the defaults with the reset code below:

margin:0px; and padding:0px;

For example, what are the default margins for the heading tag below?

<h1>Header</h1>

 Answers

51

It's different regarding which browser, thus if you want a pixel-perfect design then practice is to "reset" those values to 0 (margin and padding) and set them yourself.

"CSS reset" is very common to front-end developers, a simple example of one i use :

html,body,blockquote,code,h1,h2,h3,h4,h5,h6,p,pre{margin:0;padding:0}
button,fieldset,form,input,legend,textarea,select{margin:0;padding:0}
fieldset{border:0}
a,a *{cursor:pointer}
div{margin:0;padding:0;background-color:transparent;text-align:left}
hr,img{border:0}
applet,iframe,object{border:0;margin:0;padding:0}
button,input[type=button],input[type=image],input[type=reset],input[type=submit],label{cursor:pointer;}
ul,li{list-style:none;margin:0;padding:0;}
strong{font-weight:bold;}
em{font-style:italic;} 
Tuesday, June 1, 2021
 
sohum
answered 7 Months ago
34

Yes, it is possible - see this:

demo

.circle {
  position: relative;
  margin: 7em auto;
  width: 16em;
  height: 16em;
  border-radius: 50%;
  background: lightblue;
}

.arc {
  overflow: hidden;
  position: absolute;
  /* make sure top & left values are - the width of the border */
  /* the bottom right corner is the centre of the parent circle */
  top: -1em;
  right: 50%;
  bottom: 50%;
  left: -1em;
  /* the transform origin is the bottom right corner */
  transform-origin: 100% 100%;
  /* rotate by any angle */
  /* the skew angle is 90deg - the angle you want for the arc */
  transform: rotate(45deg) skewX(30deg);
}

.arc:before {
  box-sizing: border-box;
  display: block;
  border: solid 1em navy;
  width: 200%;
  height: 200%;
  border-radius: 50%;
  transform: skewX(-30deg);
  content: '';
}
<div class='circle'>
  <div class='arc'></div>
</div>
Thursday, June 3, 2021
 
SubniC
answered 7 Months ago
24

As documented by the W3C, who are the body behind both the XML and HTML specifications (WHATWG has a separate HTML 5 spec, but while it in some ways out of sync with the W3C spec, WHATWG does still consider it the W3C's role to bring standardise a spec as a REC), the namespace for HTML when used with an XML serialisation (which is sometimes refered to as XHTML) is http://www.w3.org/1999/xhtml.

This namespace covers all versions of HTML with such XML serialisations that have been specified so far including XHTML 1.0 and 1.1 which were in considerable use for over a decade, XHTML 2.0 which introduced several modular ideas but which was arguably of more import as an incubator for several ideas than as an implemented version, and "HTML5 serialized as XML" which is sometimes called XHTML5.

Since the other body with a horse in the race as to just how HTML 5 is specified is WHATWG, you may note that they also say that if you are serialising HTML5 as XML then you must use the namespace http://www.w3.org/1999/xhtml and with the other serialisation either not use a namespace, or use that one. Per https://wiki.whatwg.org/wiki/FAQ#What_is_the_namespace_declaration.3F:

In XHTML, you are required to specify the namespace.

<html xmlns="http://www.w3.org/1999/xhtml">

In HTML, the xmlns attribute is currently allowed on any HTML element, but only if it has the value “http://www.w3.org/1999/xhtml“. It doesn’t do anything at all, it is merely allowed to ease migration from XHTML1. It is not actually a namespace declaration in HTML, because HTML doesn’t yet support namespaces. See the question will there be support for namespaces in HTML.

The next FAQ is also relevant here:

HTML is being defined in terms of the DOM and during parsing of a text/html all HTML elements will be automatically put in the HTML namespace, http://www.w3.org/1999/xhtml. However, unlike the XHTML serialization, there is no real namespace syntax available in the HTML serialization (see previous question). In other words, you do not need to declare the namespace in your HTML markup, as you do in XHTML. However, you are permitted to put an xmlns attribute on each HTML element as long as the namespace is http://www.w3.org/1999/xhtml.

In addition, the HTML syntax provides for a way to embed elements from MathML and SVG. Elements placed inside the container element math or svg will automatically be put in the MathML namespace or the SVG namespace, respectively, by the parser. Namespace syntax is not required, but again an xmlns attribute is allowed if its value is the right namespace.

In conclusion, while HTML does not allow the XML namespace syntax, there is a way to embed MathML and SVG and the xmlns attribute can be used on any element under the given constraints, in a way that is reasonably compatible on the DOM level.

Saturday, August 14, 2021
 
Xavio
answered 4 Months ago
65

Yes it is via the new step-function easing curves property.

Instead of "ease-in" etc. use "step-start" or "step-end" which will make the transition happen instantaneously either at the beginning or end of the time period specified in transition-duration.

You can also have multiple steps: "steps(N, start | end ])" which will have the transition happen in equally spaced steps.

AFAIK this is only supported in Chrome to date.

Wednesday, August 25, 2021
 
xosp7tom
answered 4 Months ago
31

The invalid value default for these attributes is the application/x-www-form-urlencoded state. The missing value default for the enctype attribute is also the application/x-www-form-urlencoded state. (There is no missing value default for the formenctype attribute.)

— HTML 5

This attribute specifies the content type used to submit the form to the server (when the value of method is "post"). The default value for this attribute is "application/x-www-form-urlencoded". The value "multipart/form-data" should be used in combination with the INPUT element, type="file".

— HTML 4

This determines the mechanism used to encode the form's contents. It defaults to application/x-www-form-urlencoded.

— HTML 3.2

Monday, November 15, 2021
 
Aravindan R
answered 3 Weeks ago
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :
 
Share