html - (CSS) Align div elements from center to left -
I am trying to focus a div element and have left others like this:
< P>
The width and height of this code is set to px But in my own% of it, I do not know where the center is, so it needs to be changed with different resolutions. I do not want to keep it in any other div and center because it is in both DIVs centers and I just want to be in the yellow color center.
Is there a solution, by putting another empty divisor on the left, making the same height of green and making it invisible?
.container {background-color: # 34495e; Width: 500px; Height: 200 pixels; Padding: 10px; } .in-center {background-color: # f1c40f; Width: 40%; Height: 100%; Display: Inline-block; }. To-left {background-color: # 2ecc71; Width: 20%; Height: 100%; Display: Inline-block; } & lt; Div class = "container" & gt; & Lt; Div class = "in-center" & gt; & Lt; / Div & gt; & Lt; Div class = "to-left" & gt; & Lt; / Div & gt; & Lt; / Div & gt;
* { -webkit-box-sizing: border-box; -MOZ Box-Size: border-box; Box-size: border-box; }. Container {background color: # 34495e; Width: 80%; Height: 200 pixels; Text align: center; Status: Relative; } .in-center {background-color: # f1c40f; Width: 40%; Height: 100%; Display: Inline-block; }. To-left {background-color: # 2ecc71; Width: 20%; Height: 100%; Display: Inline-block; Status: Completed; } & lt; Div class = "container" & gt; & Lt; Div class = "in-center" & gt; & Lt; / Div & gt; & Lt; Div class = "to-left" & gt; & Lt; / Div & gt; & Lt; / Div & gt;
Comments
Post a Comment