AmitDiwan has Published 11365 Articles

Auto Grow a Textarea with JavaScript in CSS

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:38:37

374 Views

Using JavaScript, we can set our TextArea element to automatically grow with its content. The following examples illustrate how we can achieve the above scenario. Let us say the following is our TextArea before adding content − The following is the TextArea after adding content − The following ... Read More

Applying Sepia Effect to Images using CSS3

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:37:19

237 Views

The filter property is used to set visual effects, such as drop shadow, contrast, brightness, saturation, shadow to images in CSS. The following is the syntax − Syntax filter: none | drop-shadow() | blur() | brightness() | contrast() | grayscale() | hue-rotate() | invert() | opacity() | saturate() ... Read More

Aligning elements using the position property in CSS

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:28:39

79 Views

We can align elements using the CSS positioning schema methods (fixed, relative, absolute and static) and properties (left, right, top and bottom). To align elements in CSS, use the position property. The position can be set using the following values − static relative fixed absolute sticky For example, ... Read More

Align Flex Items along Cross Axis using CSS3

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:26:53

90 Views

We can easily align the flex items along cross axis, but first let us understand what cross axis is. The cross axis is perpendicular to the main axis. The main axis is like the flex direction − Create a Container div First, set the divs inside a container(flex container) ... Read More

Advance CSS layout with flexbox

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:23:54

461 Views

CSS3 provides a layout mode Flexible Box, commonly called as Flexbox. Flexbox (flexible box) is a layout mode of CSS3. Using this mode, you can easily create layouts for complex applications and web pages. It includes the container, flex items, etc. The container has the following properties − flex-direction ... Read More

Adjusting the Image Contrast using CSS3

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:18:17

5K+ Views

The filter property is used to set visual effects, such as drop shadow, contrast, brightness, saturation, shadow to images in CSS. The following is the syntax − Syntax filter: none | drop-shadow() | blur() | brightness() | contrast() | grayscale() | hue-rotate() | invert() | opacity() | saturate() ... Read More

Adjacent Sibling Selectors in CSS

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:15:57

971 Views

The CSS adjacent sibling selector is used to select the adjacent sibling of an element. It is used to select only those elements which immediately follow the first selector. The + sign is used as a separator. For example, the direct next element is selected here with the adjacent sibling ... Read More

Adding Hyphens to Text with the CSS hyphens Property

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:13:43

102 Views

Using the CSS hyphens property, we can specify how hyphens are added in text. The hyphens property values can be − none − The words not hyphenated manual − The words are hyphenated at ‐ or ­ The default. auto − The words are hyphenated where the deciding factor ... Read More

Adding Drop Shadow to Images using CSS3

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:09:19

8K+ Views

The filter property is used to set visual effects, such as drop shadow, contrast, brightness, saturation, shadow to images in CSS. The following is the syntax − Syntax filter: none | drop-shadow() | blur() | brightness() | contrast() | grayscale() | hue-rotate() | invert() | opacity() | saturate() ... Read More

Adding Borders to Tables in CSS

AmitDiwan

AmitDiwan

Updated on 27-Oct-2023 14:05:38

2K+ Views

Borders can be easily set on a table with CSS using the border property. Specific borders can also be set, such as left border, right border, top border, etc. With that, the border style, width, colour, etc, can be set for the left, right, top, and bottom positions. For example, ... Read More

Advertisements