Transform:scale

Odpowiedz Nowy wątek
2018-12-11 17:15
0

Mamy sobie kod:

<div style="margin-top:100px;width:auto;height:auto;border: solid 1px black; padding:4px;">
<div style="width:auto;height:auto;border: solid 1px black; padding:4px;transform: scale(1,5); ">
A oto przykładowy tekst.
</div>
</div>

A wynik jest na rysunku! Jak widzimy, div-dziecko wychodzi poza rozmiary div-rodzica po działaniu funkcji transform:scale(1,5).

Jak zrobić, aby div-rodzic dopasowywał się do rozmiaru div-dziecka nawet podziałaniu tej wspomnianej funkcji?

Pozostało 580 znaków

2018-12-11 17:18
1

Dziecko wychodzi poza rodzica z powodu zastosowanego modelu pudełkowego[1] - dorzuć do rodzica i dziecka box-sizing:border-box.

[1] domyślnie width:20px; padding:4px; spowoduje wizualnie zwiększenie szerokości do 28px (czyli domyślnie tak naprawdę actualWidth = width + paddingLeft + paddingRight).


edytowany 3x, ostatnio: Patryk27, 2018-12-11 17:18

Pozostało 580 znaków

2018-12-11 18:04

Jak dodałem do rodzica i dziecka box-sizing:border-box, co po zastosowaniu tego w:

<div style="margin-top:100px;width:auto;height:auto;border: solid 1px black; padding:4px;box-sizing:border-box">
<div style="width:auto;height:auto;border: solid 1px black; padding:4px;transform: scale(1,5);box-sizing:border-box">
A oto przykładowy tekst.
</div>
</div>

To to nie działa!

Co to znaczy nie działa? + nie krzycz tyle :-P - Patryk27 2018-12-11 18:33

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0