0
I have the following html code:
.outer-box {
width: 300px;
height: 250px;
margin: 50px auto;
background-color: black;
}
.inner-box {
width: 200px;
height: 200px;
margin: 0 auto;
background-color: yellow;
}<div class="outer-box">
<div class="inner-box"></div>
</div>But the square inside is not symmetrical or parallel to the outside
Man did not understand, what you mean by "symmetrical or parallel", you wanted to line up in the center? It was not clear how the final result should be...
– hugocsl
yes I want to line up in the center
– user221459
@hugocsl could review this duplicate because it does not answer the doubt!
– novic
@Virgilionovic from what I understand he wants to center an element in the other, he himself stated it in the comment above. No answer I marked as duplicate has 23 responses about it. Not even the author himself manifested himself regarding the closure. Because you understand that it is not duplicated?
– hugocsl
@hugocsl the author is another subject you know they put there disappear and say nothing, regarding the question the attached answers do not really have what he needs, maybe there is another but this one I do not see that has, even very ancient could you who has deep knowledge answer!
– novic
@Virgilionovic the question is old, but the answers not so much, including there have all the most modern methods of alignment with crossbrowser well accepted. If you think he’s talking about Aspect ratio I added 3 more duplicates
– hugocsl
not all right @hugocsl no problem
– novic
@Virgilionovic quiet, let’s see if the author manifests, speaking for me I see no problem in taking the closing vote if that’s the case
– hugocsl
i want to post an image of the final result, but I’m new here in the stack and I’m having a hard time doing it
– user221459
I uploaded Imgur.com, https://imgur.com/CnNpxEM
– user221459
@hugocsl the time zone where I am is not the same as Brazil
– user221459
I understand, @user221459 actually your question had not been very clear, but I added one more answer as duplicate, with the first one and the last one you solve the problem. Even study enough the first question, there have all alignment methods in the center
– hugocsl
@hugocsl thank you so much!!
– user221459
I was able to solve with the following code
.inner-box {
 width: 30px;
 height: 30px;
 border: 10px solid #1785eb; 
}

.outer-box {
 border: 10px solid #f24c46;
 width: 50px;
}– user221459