[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:00.00,0:00:03.88,Default,,0000,0000,0000,,div-ებს ხშირად იმიტომ ვიყენებთ, რომ\Nგვერდის ყუთებად დაშლა გვინდა,
Dialogue: 0,0:00:03.88,0:00:07.74,Default,,0000,0000,0000,,ან ამ ყუთების ზომების შეცვლა,\Nან მათი გადაადგილება.
Dialogue: 0,0:00:07.74,0:00:11.56,Default,,0000,0000,0000,,კარგი თვალია საჭირო იმისთვის,\Nრომ გადაწყვიტო სად რა განათავსო გვერდზე,
Dialogue: 0,0:00:11.56,0:00:13.03,Default,,0000,0000,0000,,ისე რომ კარგად გამოიყურებოდეს.
Dialogue: 0,0:00:13.03,0:00:16.48,Default,,0000,0000,0000,,ახლა, ჩვენ არ ვიზრუნებთ გვერდის\Nსილამაზეზე.
Dialogue: 0,0:00:16.48,0:00:18.91,Default,,0000,0000,0000,,უბრალოდ, გაჩვენებთ თუ როგორ უნდა\Nშეცვალოთ რაღაცები.
Dialogue: 0,0:00:18.91,0:00:22.00,Default,,0000,0000,0000,,მოდი, ზომა შევუცვალოთ\N"official-info" div-ს.
Dialogue: 0,0:00:22.00,0:00:25.79,Default,,0000,0000,0000,,ჩვეულებრივ, div-ი იღებს შესაძლებელი\Nსიგანის 100 პროცენტს.
Dialogue: 0,0:00:25.79,0:00:29.36,Default,,0000,0000,0000,,ესაა მიზეზი თუ რატომ არის\Nნაცრისფერი ყუთი მთელ სიგანეზე გაშლილი.
Dialogue: 0,0:00:29.36,0:00:32.74,Default,,0000,0000,0000,,შეიძლება მინდოდეს, რომ\Nმან დაიკავოს 300 პიქსელი.
Dialogue: 0,0:00:32.74,0:00:40.15,Default,,0000,0000,0000,,დავამატებ ახალ თვისებას CSS-ში\Nwidth: 300px; (სიგანე 300 პიქსელი)
Dialogue: 0,0:00:40.18,0:00:43.00,Default,,0000,0000,0000,,სიგანე შეიცვალა, მაგრამ ახლა\Nსხვა რამ გავაკეთოთ.
Dialogue: 0,0:00:43.00,0:00:44.97,Default,,0000,0000,0000,,მოდი, გამოვიყენოთ პროცენტობრივი სიგანე.
Dialogue: 0,0:00:44.97,0:00:50.51,Default,,0000,0000,0000,,და ვთქვათ, რომ div-მა ყოველთვის უნდა\Nდაიკავოს შესაძლებელი სიგანის 70 %.
Dialogue: 0,0:00:50.51,0:00:53.33,Default,,0000,0000,0000,,ახლა ტექსტი მოთავსებულია ამ\Nმცირე ყუთში.
Dialogue: 0,0:00:53.33,0:00:55.50,Default,,0000,0000,0000,,და div-ი სიმაღლეში გაიზარდა.
Dialogue: 0,0:00:55.50,0:00:59.14,Default,,0000,0000,0000,,თუ გვუსრს, ასევე შეგვიძლია\Nსიმაღლის კონტროლიც.
Dialogue: 0,0:00:59.14,0:01:01.10,Default,,0000,0000,0000,,სიმაღლის თვისებით.
Dialogue: 0,0:01:01.10,0:01:03.80,Default,,0000,0000,0000,,height: 180px;\N(სიმაღლე 180 პიქსელი)
Dialogue: 0,0:01:03.80,0:01:06.81,Default,,0000,0000,0000,,რაღაც სახალისო მოხდა.
Dialogue: 0,0:01:06.81,0:01:09.64,Default,,0000,0000,0000,,ნაცრისფერი ყუთი შემცირდა 180 პიქსელამდე,
Dialogue: 0,0:01:09.64,0:01:14.10,Default,,0000,0000,0000,,მაგრამ ტექსტი ყუთის გარეთ გადის.
Dialogue: 0,0:01:14.10,0:01:15.81,Default,,0000,0000,0000,,რა მოხდა?
Dialogue: 0,0:01:15.81,0:01:20.53,Default,,0000,0000,0000,,ეს იმ თვისების ბრალია, რომელსაც\N'overflow'-ს (გადაღვრას) ვეძახით.
Dialogue: 0,0:01:20.53,0:01:23.89,Default,,0000,0000,0000,,'overflow'-ს ჩვეულებრივი მნიშნველობა,\Nარის 'visible' (ხილვადი),
Dialogue: 0,0:01:23.89,0:01:28.31,Default,,0000,0000,0000,,რაც ნიშნავს, რომ ელემენტის ზომა იცვლება\Nმაგრამ შიგთავსი გარეთ გამოდის,
Dialogue: 0,0:01:28.31,0:01:30.54,Default,,0000,0000,0000,,რაც სულელურად გამოიყურება.
Dialogue: 0,0:01:30.54,0:01:33.54,Default,,0000,0000,0000,,სხვა რა თვისებები გვაქვს გადაღვრისთვის?
Dialogue: 0,0:01:33.54,0:01:36.98,Default,,0000,0000,0000,,შეგვიძლია ვცადოთ 'hidden' (დამალვა).
Dialogue: 0,0:01:36.98,0:01:40.33,Default,,0000,0000,0000,,იგი, ჭრის შიგთავსის იმ ნაწილს,\Nრომელიც ფარგლებს სცდება.
Dialogue: 0,0:01:40.36,0:01:42.10,Default,,0000,0000,0000,,მაგრამ, ჩვენ ეს არ გვჭირდება,
Dialogue: 0,0:01:42.10,0:01:46.29,Default,,0000,0000,0000,,რადგანაც მაშინ მომხმარებელს არ ექნება\Nმთლიანი ინფორმაციის წაკითხვის საშუალება.
Dialogue: 0,0:01:46.29,0:01:49.10,Default,,0000,0000,0000,,ჩვენ ასევე შეგვიძლია ვცადოთ 'auto',
Dialogue: 0,0:01:49.11,0:01:52.83,Default,,0000,0000,0000,,რომელიც ეუბნება ბრაუზერს, რომ დაამატოს\Nჩამოსაცურებელი თუ შიგთავსი იღვრება.
Dialogue: 0,0:01:52.83,0:01:57.07,Default,,0000,0000,0000,,ახლა, შეგვიძლია ჩამოვაცუროთ ყუთის\Nშიგთავსი და ვნახოთ ტექსტი.
Dialogue: 0,0:01:57.07,0:01:59.48,Default,,0000,0000,0000,,თუ გვინდა, შეგვიძლია უფრო\Nსპეციფიკური რამ ვქნათ:
Dialogue: 0,0:01:59.48,0:02:02.93,Default,,0000,0000,0000,,შეგვიძლია, მივუთითოთ განსხვავებული\Nთვისება სხვადასხვა მიმართულებებისთვის.
Dialogue: 0,0:02:02.93,0:02:04.18,Default,,0000,0000,0000,,მაგალითად, თუ მინდა, რომ
Dialogue: 0,0:02:04.18,0:02:07.64,Default,,0000,0000,0000,,გამოვიყენო ჩამოსაცურებელი y მიმართულებით\Nანუ ზევით და ქვევით.
Dialogue: 0,0:02:07.64,0:02:10.88,Default,,0000,0000,0000,,უნდა დავწეროთ: overflow-y: auto;
Dialogue: 0,0:02:10.88,0:02:14.21,Default,,0000,0000,0000,,მაგრამ თუ გვინდა დალაგება\Nx მიმართულებით, შეგვიძლია
Dialogue: 0,0:02:14.21,0:02:18.52,Default,,0000,0000,0000,,დავწეროთ: overflow-x: hidden;
Dialogue: 0,0:02:18.52,0:02:21.42,Default,,0000,0000,0000,,ფრთხილად იყავით, როდესაც იყენებთ\Nგადაღვრას, რადგანაც
Dialogue: 0,0:02:21.42,0:02:24.61,Default,,0000,0000,0000,,ჩამოსაცურებელმა, შეიძლება გააღიზიანოს\Nმომხმარებელი.
Dialogue: 0,0:02:24.61,0:02:27.22,Default,,0000,0000,0000,,განსაკუთრებით, ჩამოსაცურებელი\Nჩამოსაცურებელში.
Dialogue: 0,0:02:27.22,0:02:29.23,Default,,0000,0000,0000,,ასეთ შემთხვევებს მოერიდეთ.
Dialogue: 0,0:02:29.23,0:02:33.97,Default,,0000,0000,0000,,დავუბრუნდეს სიგრძე-სიგანეს,\Nჩვენ შეგვიძლია გამოვიყენოთ
Dialogue: 0,0:02:33.97,0:02:37.70,Default,,0000,0000,0000,,სიგრძე და სიგანე მრავალი სახის\Nელემენტისთვის, მაგალითად სურათებისთვის.
Dialogue: 0,0:02:37.70,0:02:42.17,Default,,0000,0000,0000,,ახლა, როდესაც ვიცნობთ CSS-ს შეგვიძლია\Nგამოვიყენოთ სიგრძე-სიგანის CSS თვისებები
Dialogue: 0,0:02:42.17,0:02:44.93,Default,,0000,0000,0000,,სიგრძე-სიგანის ატრიბუტების მაგივრად.
Dialogue: 0,0:02:44.95,0:02:52.54,Default,,0000,0000,0000,,მოდი, გავზარდოთ კატის სურათი\Nდა დავარქვათ მას "cute-cat",
Dialogue: 0,0:02:52.54,0:02:55.42,Default,,0000,0000,0000,,წავშალოთ ატრიბუტი,
Dialogue: 0,0:02:55.42,0:03:00.40,Default,,0000,0000,0000,,და დავუბრუნდეთ ჩვენს სტილის წესს,\Nმივუთითოთ
Dialogue: 0,0:03:00.40,0:03:03.62,Default,,0000,0000,0000,,#cute-cat {width: 120px;\N}
Dialogue: 0,0:03:03.62,0:03:06.33,Default,,0000,0000,0000,,ატრიბუტების მსგავსად
Dialogue: 0,0:03:06.33,0:03:09.03,Default,,0000,0000,0000,,ჯობია მივუთითოთ მხოლოდ სიგრძე\Nან მხოლოდ სიგანე,
Dialogue: 0,0:03:09.03,0:03:12.64,Default,,0000,0000,0000,,მიეცით ბრაუზერს საშუალება, რომ\Nთვითონ განსაზღვროს მეორე განზომილება.
Dialogue: 0,0:03:12.64,0:03:14.80,Default,,0000,0000,0000,,სხვა შემთხვევაში გაჭყლეტილ კატას მივიღებთ!
Dialogue: 0,0:03:14.80,0:03:18.88,Default,,0000,0000,0000,,საინტერესოდ ჟღერს, მაგრამ მოდი ვცადოთ
Dialogue: 0,0:03:18.88,0:03:20.02,Default,,0000,0000,0000,,height: 40px;\N(სიმაღლე - 40 პიქსელი)
Dialogue: 0,0:03:20.02,0:03:22.07,Default,,0000,0000,0000,,ჰაჰა, გაჭყლეტილი კატა - ვაშა!
Dialogue: 0,0:03:22.07,0:03:29.02,Default,,0000,0000,0000,,მოდი, პასუხისმგებლობის მქონე\Nვებ დეველოპერი ვიქნები და ამას წავშლი.
Dialogue: 0,0:03:29.02,0:03:33.28,Default,,0000,0000,0000,,რაც უფრო მეტი ცოდნა გაქვს,\Nმით უფრო მეტი პასუხისმგებლობა გაკისრია.
Dialogue: 0,0:03:33.28,0:03:37.50,Default,,0000,0000,0000,,რადგან შეგიძლია ჩამოსაცურებლების დამატება\Nდა კატების გაჭყლეტვა, არ ნიშნავს რომ
Dialogue: 0,0:03:37.50,0:03:39.59,Default,,0000,0000,0000,,ასე უნდა მოიქცე.
Dialogue: 0,0:03:39.59,0:03:42.58,Default,,0000,0000,0000,,იმიტომ, რომ ძირითადად ვაკეთებთ\Nვებ გვერდებს სხვა ადამიანებისთვის.
Dialogue: 0,0:03:42.58,0:03:47.69,Default,,0000,0000,0000,,რაც შენთვის სახალისოა, შეიძლება\Nსხვისთვის რთულად გამოსაყენებელი იყოს.
Dialogue: 0,0:03:47.69,0:03:54.08,Default,,0000,0000,0000,,მაგრამ თუ გაერთობით Khan Academy-ზე\Nწინააღმდეგი არ ვარ.