wyśrodkowanie elementów w poziomie

wyśrodkowanie elementów w poziomie
SH
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 30
0

Mam pytanie odnośnie jak wyśrodkować w poziomie coś takiego: - - - - - * * * * * - - - - - . Chodzi oczywiście o wyśrodkowanie elementów w jednej linii w poziomie względem siebie.

katakrowa
  • Rejestracja: dni
  • Ostatnio: dni
  • Lokalizacja: Chorzów
  • Postów: 1670
2

Napisz o jakie elementy chodzi... Divy można tak:

Kopiuj
<body>
<div style="width:100%;">
  <div style="width:700px;background:red;margin:auto;">dowolny elm. 1</div>
  <div style="width:700px;background:red;margin:auto;">dowolny elm. 2</div>
</div>
</body>
SH
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 30
0

dokładnie chodzi o wypoziomowanie takich elementów : - - - - - * * * * * - - - - -

NS
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 457
1

@katakrowa: i to (notacja autora) jest dopiero abstrakcja :D

DO
  • Rejestracja: dni
  • Ostatnio: dni
  • Lokalizacja: Zielona Góra
0

Użyj flex

SH
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 30
katakrowa
  • Rejestracja: dni
  • Ostatnio: dni
  • Lokalizacja: Chorzów
  • Postów: 1670
0
shreker napisał(a):

jest coś takiego : https://zapodaj.net/5be6ad1392474.gif.html

a chodzi o to : https://zapodaj.net/8b2b16f517d91.gif.html

Ja pireodle !!! Rozwaliłeś system!

SH
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 30
0

może i rozwaliłem, ale dalej nie widzę jakoś równie rozwalającej odpowiedzi

NS
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 457
0
Kopiuj
<div>
<div style="background-color:blue;width:50%;float:left">
<p>First div</p>
</div>
<div style="background-color:red;width:50%;float:left">
<p>Second div</p>
</div>
</div>
katakrowa
  • Rejestracja: dni
  • Ostatnio: dni
  • Lokalizacja: Chorzów
  • Postów: 1670
1

No cóż, niestandardowo zadane pytania wymagają niestandardowych odpowiedzi :-)

https://jsfiddle.net/97mg4veL/57/

screenshot-20201020230017.png

Kopiuj
<body>
<style>
  .cntr{
    margin:auto;
    height:40px;
  }
</style>
  <div style="transform: rotate(-90deg);">
    <div class="cntr" style="width:120px;background:red;"></div>
    <div class="cntr" style="width:30px;background:blue;"></div>
    <div class="cntr" style="width:80px;background:green;"></div>
    <div class="cntr" style="width:40px;background:brown;"></div>
    <div class="cntr" style="width:60px;background:purple;"></div>
    <div class="cntr" style="width:150px;background:gray;"></div>
  </div>
</body>
bearek
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 85
1

@shreker znamy się z innego forum, więc wyżebram punkciki i tu. Do elementu z gwiazdkami daj:

Kopiuj
position: relative;
top: .23em;
SH
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 30
0

Super, tylko drobny szczegół, ... to nie rozwiązuje problemu. Zabawa kolorowymi bloczkami to jedno, ale problem polegał na zupełnie czym innym. Na szczęście znaleźli się inni którzy zamiast twierdzić że ktoś rozwalił system, podeszli poważnie do problemu i go rozwiązali, zamiast udawać ... no właśnie.

katakrowa
  • Rejestracja: dni
  • Ostatnio: dni
  • Lokalizacja: Chorzów
  • Postów: 1670
1
shreker napisał(a):

Super, tylko drobny szczegół, ... to nie rozwiązuje problemu. Zabawa kolorowymi bloczkami to jedno, ale problem polegał na zupełnie czym innym. Na szczęście znaleźli się inni którzy zamiast twierdzić że ktoś rozwalił system, podeszli poważnie do problemu i go rozwiązali, zamiast udawać ... no właśnie.

Rozwiązanie całkowicie adekwatne do sposobu w jaki zadałeś pytanie.

serek
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 1506
1
shreker napisał(a):

Super, tylko drobny szczegół, ... to nie rozwiązuje problemu.

No to weź opisz co chcesz osiągnąć, bo tu chyba nikt nie wie o co Ci chodzi. Czym są te znaczki na obrazku?

Freja Draco
  • Rejestracja: dni
  • Ostatnio: dni
  • Postów: 3394
0

A... znaczy się ty w PIONIE chcesz centrować:
https://www.w3schools.com/howto/howto_css_center-vertical.asp

Zarejestruj się i dołącz do największej społeczności programistów w Polsce.

Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.