<div> Full 100% width

[NorseMan]

What am I doing wrong? I want the <div> to strech out 100% to the right as well.
It is like this in Chrome, Opera and Edge.
Attached under the picture is the CSS and the HTML.

Code: Select all

div.content1 {
	/*text-align: center;*/
	font-family: "Consolas", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	font-weight: bold;
	font-size: 14px;	
	color: #ff6633;
	margin: auto;
	margin-top: 200px;
	position: initial;
	background-color: #676565;
	width: 100%;
	height: 300px;
	border: thin;
	border-radius: 5px;
	/*box-shadow: rgba(51, 51, 51, 0.2) 0px 1px 8px 0px;*/
}

Code: Select all

<div class="content1">&nbsp;<>><<></div>

[Michalio]

the margin:auto may add some space on the right, use developers tools (each browser have good tool for that) to check the element padding/margin and its parents. You can also install Firefox Developer Edition to have advanced developer tools

[NorseMan]

No, that didn't help. So I had to start over again and look for the error. I found it and i had an "padding-right: 10px;" in my "body" i must have overseen before. So when i removed this it was 100% again

[jason06]

I am also experiencing the same problem with my website Some of my divs are not centered and some are not 100% wide.

What's the solution?

[NorseMan]

jason06, In my case it was my own fault. I didn't think about a padding right I had in my HTML body tag. I had overseen it, or not think about it. So in my case this time I had to remove this and everything was OK.

But I have read me up on another thing too. Have you heard about the "clear" "CSS property"? I've found a good article about it on MDN Web Docs.

https://developer.mozilla.org/en-US/docs/Web/CSS/clear#try_it

[Michalio]

upload your code somewhere where we can saw the results then we will be able to find the reason of the issue

[NorseMan]

Isn't in my first posting

[Michalio]

I was asking jason06