Found 1566 Articles for CSS

The max-width property is used to set the maximum width that a box can be. The value of the max-width property can be a number, a length, or a percentage.                            This paragraph is 200px high and max width is 100px          This paragraph is 200px high and max width is 100px                

The padding-left specifies the left padding of an element. It sets the left padding of an element. This can take a value in terms of length of %. Example                            This is a paragraph with a specified left padding                      This is another paragraph with a specified left padding in percent          

The marker-offset property allows you to specify the distance between the marker and the text relating to that marker.Example                            LAN          WAN          

The list-style serves as shorthand for the preceding properties. The list-style allows you to specify all the list properties into a single expression.Example                            Table          Chair          

The padding-left specifies the left padding of an element. It sets the left padding of an element. This can take a value in terms of length of %.Eaxmple                                This is demo content.                           This is another demo content.            

The following image justifies the difference between collapse and separate. The separate value of the border-collapse property separates the borders of the cells:ExampleYou can try to run the following code to understand the difference between border-collapse separate and collapse value:                    table.one {             border-collapse:collapse;          }          table.two {             border-collapse:separate;          }          td.a {             border-style:dotted;             border-width:2px;             border-color:#000000;             padding: 20px;          }          td.b {             border-style:solid;             border-width:2px;             border-color:#333333;             padding:20px;          }                              Border Collapse           India           Australia                            Border Separate           India           Australia          

Parent selectors are not present in CSS3. There is a proposed CSS4 selector, $, to do so, which could look like this (Selecting the li element) −ul $li ul.sub { ... }As an alternative, with jQuery, a one-liner you could make use of would be this. The: has() selector selects all elements that have one or more elements inside of them, that matches the specified selector. The tag defines a list item. The tag defines an unordered (bulleted) list.$('ul li:has(ul.sub)').addClass('has_sub');You could then style the li.has_sub in your CSS.

The position property specifies the type of positioning method used for an element (static, relative, absolute, fixed, or sticky).In the below-given example, no height is specified in percentage and no jQuery is needed.mainbody{      position: absolute;//here we are setting the position of an element as absolute    top: 30px; /* here we are defining Header Height to 30 px */    bottom: 10px; /*here we are defining  Footer Height to 10 px */    width: 100%;// here we are setting the width to 100% }

To debug CSS/JavaSript hover issues, you need to follow the below-given steps, Press F12 to open Inspect Element, in Firefox. In the DOM view right-click the element, and Select :hover, :active or :focus at the bottom of the context menuThe following screenshot shows how to debug hover issues −

A favicon is a little icon visible on the web browser tab, just before the page title. It is generally a logo with the smaller size.You cannot add the size using CSS. The standards do not support adding Favicon size using CSS. Let’s add it using attributes,The result after adding Favicon above will be,