-2

how can i move html elemnts without using padding because i need border for color, or margin for evoid colapse with other elements of the structure? is there any way for do it ? or is the only way and i should evoid colapse with others elemnts?.

" Margin es el margen que hay desde un elemento hasta los que tenga al lado.

Border dibuja un borde alrededor justo de ese contenido.

Padding es el espacio que hay en un contenedor entre el contenido y los bordes del contenedor."

Pachi
  • 17
  • 6

1 Answers1

0

in the beginning when we start learning we usually use border, margin and padding for moving elements. But there are others options like:

Position: relative, absolute, fixed...

Once you use a position property you can start using:

Left, Right, Top and Bottom

Example: 

.miClass {
    position:relative;
    top: 200px;
}

I recommend you use them for learning, just learning because those aren't not quite useful, if you use them in all your elements it will probably be a bad idea.

Just play with those properties and also you could use: transform: translateX() translateY() etc...

Once you get experience I recommend you start being a pro and use display:flex;, and also you will need a correct html structure for making responsives designs and really pro things... It isn't easy to but believe me, once you get it you will fall in love.

Look to my reply in this post: How to Make Navigation Buttons Mobile-Responsive and Collapse in Order? Here I talk about "natural order" in CSS.

Recommendations:

  • Learn by making fails.
  • Learn how to use properly % instead of px
  • Learn display:flex
  • Please Spanish question need to be in Stackoverflow in Spanish
  • There a lot of tutorials where you can learn all these things

Good luck :)

pharesdiego
  • 119
  • 5
  • Ty! But u think is better for move elements position or padding ? – Pachi Nov 05 '17 at 05:41
  • I really don't use padding or position for moving elements, they are for styling and giving a nice look to elements. I think the only one that you could use for moving is `margin`. I usually move my elements by using `display:flex`and its properties like `align-items, justify, order... etc` and using a good html structure that allows me to don't even use margin, padding or translate for moving elements – pharesdiego Nov 05 '17 at 05:45
  • so u think is not necessary if u have a good structure, use position ? Ty – Pachi Nov 05 '17 at 05:47
  • Look this: https://codepen.io/pharesdiego/pen/qXbNaR?editors=1100 I'm just using display flex or grid for position, and also this https://codepen.io/pharesdiego/pen/VzexZd – pharesdiego Nov 05 '17 at 05:48