Forem: vidhya murali

HTML,CSS Questions

vidhya murali — Sat, 23 May 2026 03:40:11 +0000

Display Properties

CSS display property defines how an element is shown on the webpage.

Common Display Properties

display: block

Element takes full width and starts on a new line.

Examples: div, h1,p

display: inline

Element takes only content width.

Examples: span ,a, b

display: inline-block

Combination of inline + block.

display: none

Element completely disappears

*Box-Sizing Property *:

box-sizing defines how the total width and height of an element are calculated

box-sizing: content-box (Default)

Width only applies to content area.

box-sizing: border-box

Padding and border are included inside width

GIT

vidhya murali — Sat, 23 May 2026 03:29:39 +0000

GIT

Git is a free and open source distributed version control system designed to handle everything from small to very large projects with speed and efficiency.
It is used to track changes in code, collaborate with others, and manage software projects efficiently.

Basic Git Workflow
Modify files

git add .
git commit -m "message"
git push ** GitHub**

GitHub is a cloud-based platform used to host Git repositories and collaborate on software projects.

It works together with Git.

What GitHub is Used For

Storing code online
Collaboration with teams
Version control
Open-source projects
Portfolio for developers
CI/CD and deployment

GitLab :

GitLab is a web-based platform used for Git repository hosting, collaboration, DevOps, and CI/CD automation.

It is similar to GitHub but includes more built-in DevOps features.

Features of GitLab

Git repository hosting
Version control
Branch management
Merge requests
Issue tracking
CI/CD pipelines

HTML, CSS interview Questions

vidhya murali — Tue, 19 May 2026 03:27:29 +0000

*Meta tag *

The tag defines metadata about an HTML document. Metadata is data (information) about data.
tags always go inside the element, and are typically used to specify character set, page description, keywords, author of the document, and viewport settings.

Alternate for HTML
XML:
Extensible Markup Language (XML) is a markup language used for storing structured data. It uses custom tags to define the elements which support a wide range of elements. It was developed because HTML was unable to define new elements hence XML was introduced which was extensible to define custom elements.
It was designed to store and transport data and contain information about the sender, receiver, heading, and message body. It is more focused on what data is rather than how data looks. It is used for representing documents, data, transactions, invoices, etc.

Example: Implementation of the basic structure of XML code.

XHTML:
Extensible Hypertext Markup Language (XHTML) is a markup language that is used to create HTML documents that support custom tags to define new elements. It is more strict than HTML in terms of error handling i.e browser doesn't display web pages in case of errors in the markup document. It creates an XML version of the HTML document which must be marked up correctly.

Box-Sizing

CSS Box Sizing

The CSS box-sizing property defines how to calculate the width and height of an element: should the calculation include padding and borders, or not.
By default, the width and height of an element is calculated like this:

- width + padding + border = actual width of an element
- height + padding + border = actual height of an element This means: When you set the width/height of an element, the element often appears bigger than you have set (because the element's border and padding are added to the element's specified width/height)

Tables in HTML

vidhya murali — Tue, 19 May 2026 03:18:01 +0000

Define an HTML Table
A table in HTML consists of table cells inside rows and columns.
HTML tables allow web developers to arrange data into rows and columns.

Each table cell is defined by a and a tag.[td stands for table data.]
Each table row starts with a and ends with a tag.[tr stands for table row.]
Sometimes you want your cells to be table header cells. In those cases use the tag instead of the tag.[th stands for table header.]

Reference : https://www.w3schools.com/html/html_tables.asp

HTML and CSS

vidhya murali — Fri, 15 May 2026 03:14:34 +0000

SEMANTIC TAGS

A semantic element clearly describes its meaning to both the browser and the developer.
Examples of non-semantic elements: div and span - Tells nothing about its content.
Examples of semantic elements: img, table, article - Clearly defines its content.

CSS DISPLAY PROPERTY
The display property specifies the display behavior (the type of rendering box) of an element.

CSS Flexbox (Flexible Box Layout)

Flexbox is a layout model for arranging items (horizontally or vertically) within a container, in a flexible and responsive way.
Flexbox makes it easy to design a flexible and responsive layout, without using float or positioning.

A flexbox always consists of:

A Flex Container - The parent (container) element, where the display property is set to flex or inline-flex
One or more Flex Items - The direct children of the flex container automatically becomes flex items

CSS justify-content Property

The justify-content property aligns the flexible container's items when the items do not use all available space on the main-axis (horizontally).

CSS align-items Property

The align-items property specifies the default alignment for items inside a flexbox or grid container.

In a flexbox container, the flexbox items are aligned on the cross axis, which is vertical by default (opposite of flex-direction).
In a grid container, the grid items are aligned in the block direction. For pages in English, block direction is downward and inline direction is left to right.
For this property to have any alignment effect, the items need available space around themselves in the appropriate direction. Tip: Use the align-self property of each item to override the align-items property.

Reference : https://www.w3schools.com/html/html5_semantic_elements.asp

DAY 2- CSS

vidhya murali — Thu, 14 May 2026 03:25:43 +0000

What is CSS?

CSS is the language we use to style a Web page.
CSS stands for Cascading Style Sheets
CSS describes how HTML elements are to be displayed on screen, paper, or in other media
CSS saves a lot of work. It can control the layout of multiple web pages all at once
External stylesheets are stored in CSS files

*CSS Syntax *:

A CSS rule consists of a selector and a declaration block:
The selector points to the HTML element you want to style.
The declaration block contains one or more declarations separated by semicolons.
Each declaration includes a CSS property name and a value, separated by a colon.
Multiple CSS declarations are separated with semicolons, and declaration blocks are surrounded by curly braces.

The CSS Box Model

In CSS, the term "box model" is used when talking about web design and layout.
The CSS box model is essentially a box that wraps around every HTML element.
Every box consists of four parts: content, padding, borders and margins.

The image below illustrates the CSS box model

CSS Backgrounds

The CSS background properties are used to add background effects for elements.

Reference : https://www.w3schools.com/css/css_background.asp

Day1 - HTML

vidhya murali — Wed, 13 May 2026 03:24:26 +0000

Hi all. Today I Learnt about HTML.

What is HTML ?

HTML stands for Hyper Text Markup Language
HTML is the standard markup language for creating Web pages
HTML describes the structure of a Web page
HTML consists of a series of elements
HTML elements tell the browser how to display the content
HTML elements label pieces of content such as "this is a heading", "this is a paragraph".

What is Markup Language?

A markup language is a text-encoding system that uses tags or symbols to define the structure, formatting, or relationships within a document, allowing computers to interpret and display content properly. It separates content from presentation, defining elements like headings and links rather than performing logic.

What is Elements ?
The HTML element is everything from the start tag to the end tag with Content.

What is metaData ?

The tag defines metadata about an HTML document. Metadata is data (information) about data.
tags always go inside the element, and are typically used to specify character set, page description, keywords, author of the document, and viewport settings.
Metadata will not be displayed on the page, but is machine parsable.
Metadata is used by browsers (how to display content or reload page), search engines (keywords), and other web services.
There is a method to let web designers take control over the viewport (the user's visible area of a web page), through the tag (See "Setting The Viewport" example below).

Linux

vidhya murali — Mon, 11 May 2026 13:34:56 +0000

Hi all,

Today I learnt about Linux Basics.

what is Linux - Linux is a Free Open Source Operating System used in Servers, Laptops, Phones.

Why - Free to use, Secure , Fast and Lightweight, Customizable ,98% companies and developers using Linux.

Basic Linux Commands :

1, To check Current Directory - pwd
2,To list files - ls
3,To change Directory - cd
4,Go back - cd..
5,To create new Folder - mkdir
6,To create File - touch