+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: Wrappers & Containers (/showthread.php?tid=5780774)
Wrappers & Containers - Bluffer - Jan 6, 2018
I feel like I know most things when it comes to html and css. I haven't a clue about wrappers and containers. I would really apreciate if somebody can either explain it or link me to some quality tutorials that will teach me about it.
RE: Wrappers & Containers - ryan⚜ - Jan 6, 2018
The words wrappers and containers are just semantic meanings for shit that encapsulates stuff. If you know html and css at an intermediate level, chances are you already know and implement both of those things.
RE: Wrappers & Containers - Bluffer - Jan 6, 2018
(Jan 6, 2018 09:19 PM)ryan⚜ Wrote: The words wrappers and containers are just semantic meanings for shit that encapsulates stuff. If you know html and css at an intermediate level, chances are you already know and implement both of those things.
Don't know it at an intermediate level.
RE: Wrappers & Containers - Invincible - Jan 6, 2018
If you are using a frontend library like Bootstrap your work becomes very easy, they have very comprehensive docs on all of it:
https://v4-alpha.getbootstrap.com/layout/grid/
https://getbootstrap.com/docs/4.0/layout/overview/#containers
RE: Wrappers & Containers - Rushax - Jan 7, 2018
Very simple, the terminology is most likely confusing you.
Here is a breakdown of a common, simple example of Bootstrap using containers.
Code
<div class="container">
<div class="col-md-6">
Half of the 'container'
</div>
<div class="col-md-3">
Quarter of the container
</div>
<div class="col-md-3">
2nd quarter of the container
</div>
</div>Using simple containers like this allows you to easily manipulate certain things. For example if I wanted to add padding to the overall container, I can easily target that with the CSS
Code
.container{
padding-top: 20px;
}Therefore this would bring the whole container (with the elements inside) down 20 pixels.
Hope this helps.