Explain CSS Box Model? - Site Owners Forums

Bates John · 09-28-2014, 10:43 PM

CSS box model is a rectangular space around a HTML element which defines border, padding and margin.

Border: - This defines the maximum area in which the element will be contained. We can make the border visible, invisible, define height and width etc.

Padding: - This defines the spacing between border and element.

Margin: - This defines the spacing between border and any neighboring elements.

softech · 10-09-2014, 11:20 PM

CSS box model is a rectangular space around a HTML element which defines border, padding and margin.

jyothireddy · 10-19-2014, 03:18 AM

All HTML elements can be considered as boxes. In CSS, the term "box model" is used when talking about design and layout. The CSS box model is essentially a box that wraps around HTML elements, and it consists of: margins, borders, padding, and the actual content. The box model allows us to add a border around elements, and to define space between elements.
There will be different parts of that like:

Content - The content of the box, where text and images appear
Padding - Clears an area around the content. The padding is transparent
Border - A border that goes around the padding and content
Margin - Clears an area outside the border. The margin is transparent

09-28-2014, 10:43 PM	#1
Bates John Registered User Join Date: Sep 2014 Posts: 15	Explain CSS Box Model? CSS box model is a rectangular space around a HTML element which defines border, padding and margin. Border: - This defines the maximum area in which the element will be contained. We can make the border visible, invisible, define height and width etc. Padding: - This defines the spacing between border and element. Margin: - This defines the spacing between border and any neighboring elements. __________________ John Bates To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts.

10-09-2014, 11:20 PM	#2
softech Registered User Join Date: Oct 2014 Posts: 1,401	CSS box model is a rectangular space around a HTML element which defines border, padding and margin. __________________ To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. \| To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. \| To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. \| To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. \| To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. \| To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts. \| To view links or images in signatures your post count must be 10 or greater. You currently have 0 posts.

Thread Tools
Show Printable Version Email this Page
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
oogle Adsense: How to Explain the Google Adsense Program to Others	theshawnchin	Google	2	06-11-2017 01:27 PM
Another box model hack alternative	davikerkrish	HTML / DHTML	0	09-06-2012 04:19 AM
Explain About Canonical Issue	bobo.cx	Search Engine Optimization	1	04-12-2012 11:34 PM
Is Recording Marketing a Unspoilt SEO Model?	rashidsohail	Search Engine Optimization	0	10-29-2011 07:33 AM

10-19-2014, 03:18 AM	#3
jyothireddy Registered User Join Date: Oct 2014 Posts: 36	All HTML elements can be considered as boxes. In CSS, the term "box model" is used when talking about design and layout. The CSS box model is essentially a box that wraps around HTML elements, and it consists of: margins, borders, padding, and the actual content. The box model allows us to add a border around elements, and to define space between elements. There will be different parts of that like: Content - The content of the box, where text and images appear Padding - Clears an area around the content. The padding is transparent Border - A border that goes around the padding and content Margin - Clears an area outside the border. The margin is transparent

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)