Post by alarsdes » Mon Nov 01, 2021 8:14 pm

ik ben een beetje aan het proberen met css. Heb er niet echt nog verstand van.
Ik heb op deze pagina https://www.112ink.nl/test
3 columns gemaakt. Maar krijg ze nog niet in het midden van de pagina.
hoe geef ik dat bij de css aan dat de columns in het midden van de pagina moeten staan
bijvoorbaat dank.

* {
box-sizing: border-box;
}
.column {
float: left; width: 260; min-width: 250px; border-style: solid; border-color: red; margin: 5px; padding: 5px;
}
*/.row:after
{
content: "";
display: table;
clear: both;
}
@media screen and (max-width: 600px)
{
.column
{
width: 100%;

}
}

Active Member

Posts

Joined
Thu Aug 25, 2011 3:36 pm

Post by sfaragy » Sat Nov 13, 2021 8:06 pm

Dit is een voorbeeld. Probeer dezelfde flex voor uw kolommen

Code: Select all

<div id="main-container">
	 <div id="left-content">
		<p>Text</p>
	</div>
	<div id="center-content">
		<p>Text</p>
	</div>
	<div id="right-content">
		<p>Text</p>
	</div>
</div>
<style>
#main-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#center-content {
  /* Lets middle column shrink/grow to available width */
  flex: 1 1 auto;
}

#left-content,
#right-content {
  /* Forces side columns to stay same width */
  flex: 0 0 100px;
}
</style>

Please contact us for any kind of module / extension/ theme development or customization, any kind of API integration, payment gateway integration, shipping method integration.

Thanks & regards
Md Soliman Faragy (sfaragy)
Skype: solimanbd4321
email: solimankhulna@gmail.com
https://www.bangloss.com
Image


User avatar
Newbie

Posts

Joined
Tue Jul 16, 2013 2:41 pm
Location - Bangladesh
Who is online

Users browsing this forum: No registered users and 107 guests