Wa hooooo!!!!!
The girl has discovered the POWER!
What I am doing here is eliminating the border of the box. Also adding a graphic to see how it works out.
home example 1 example 2 example 3 example 4 example 5 example 5a example 5c borders Nested Divs
The three big elements that you will use to style borders are style,
width
and color.
I have also after looking at this decided to add a padding to the boxes of 10px.
The girl has discovered the POWER!
What I am doing here is eliminating the border of the box. Also adding a graphic to see how it works out.
The thickness of borders are determined with the "border-width" property. It is most likely best to use pixels when determining the width of your borders.
I have chosen to use a 3px double border and 10px padding. Also, I have enclosed two divs in one to get, hopefully the desired effects that I am trying to achieve here.
I also choose to give this div a width of 490px, just to see how it would look.
What I also find interesting with the Divs is that I can keep adding text to the box, it expands as I do so.
I have added a plain empty div to example5b to give a break between the two divs. I changed the percentages of the divs and made the blank div a 1% width.
"Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum Et harumd und lookum like Greek to me, dereud facilis est er expedit distinct. Nam liber te conscient to factor tum poen legum odioque civiuda. Et tam neque pecun modut est neque nonor et imper ned libidig met, consectetur adipiscing elit, sed ut labore et dolore magna aliquam"
"Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum Et harumd und lookum like Greek to me, dereud facilis est er expedit distinct. Nam liber te conscient to factor tum poen legum odioque civiuda. Et tam neque pecun modut est neque nonor et imper ned libidig met, consectetur adipiscing elit, sed ut labore et dolore magna aliquam"
The thickness of borders are determined with the "border-width" property. It is most likely best to use pixels when determining the width of your borders.
I have chosen to use a 3px double border with a padding of 10px with this div, which is enclosed in the nested div with the one next to this on the page.
I also choose to give this div a width of 230px, just to see how it would look.
What I also find interesting with the Divs is that I can keep adding text to the box, it expands as I do so.
"Lorem ipsum dolor sit amet, consectetaur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."
Powered by counter.bloke.com