Dimensions with CSS

Dimensions with CSS is the section 15 of Beginner’s Guide to CSS.

Any HTML element with CSS Box model has a width and a height. I guess you remember the calculation of the total width and height we did in the box model sectionThe CSS dimension properties allow you to control the height and width of an element. We can do lot of things using these width and height property.

CSS Width and Height of an image

See how we can change the dimensions of an image. Following is the original size of the image. See how it can be change.

 

Titanic

Titanic
[code language=”html”] Titanic[/code]
Titanic
[code language=”html”] Titanic[/code]

Now let’s look at the paragraph element.

This is a paragraph with a specific width.

You can also define a maximum and minimum, height or width for a HTML element.

This is a one paragraph with a maximum height. This is the second text. This is the third text. This is the fourth text. This is the fifth text. This is the sixth text. This is the seventh text. This is the eight text. This is the ninth text. This is the tenth text. This is the eleventh text.

 

[code language=”html”]

This is a one paragraph with a maximum height. This is the second text. This is the third text. This is the fourth text. This is the fifth text. This is the sixth text. This is the seventh text. This is the eight text. This is the ninth text. This is the tenth text. This is the eleventh text.

[/code]

You’ll see all the content text with the yellow background is not displayed in the browser.


In this section we looked at the beyond of height and width properties of CSS. Next section we go into display and visibility of HTML elements.

WHAT’S NEXT?

Let’s learn how to play Hide and Seek with CSS.

 

Written by Sandeep Likhar

Sandeep Likhar is from India, where he is a blogger, eBook designer, and founder of LetsDnD. He has 6 years of experience in the industry as a Digital Publishing Expert and eBook Converter, providing services to authors, publishers, and distributors worldwide. He is proficient in converting books into various formats, such as HTML, epub, mobi, word, PDF, including all major online platforms like iTunes, Kobo, Kindle, CreateSpace, B&N, Smashwords, and more.

One Comment

Leave a Reply
  1. Hi, I do think his is an excellent website. I stumbledupon it
    😉 I’m going to return once again since i have book-marked it.
    Money and freedom is the besst way to change,
    may you be rich and continue to guide other people.

Leave a Reply

Your email address will not be published. Required fields are marked *