Merge pull request #59 from vandreas73/master

CSS labor typos

docs/laborok/09-css/index.md

@@ -135,7 +135,7 @@ Lehetőség van esetenként több szabály aggregált megadására is ún. short
 !!! warning "Inline stílusok"
     Inline stílusokat csak kivételes esetekben használjunk, jellemzően programozottan (JavaScriptből) elfogadott lehet egy elem megjelenését ilyen módon állítani, de a nyers HTML-ben nem!
 
-* Vegyünk fel egy új szabályt, amiben megadjuk, hogy a táblázat cellák `td` paddingja 1rem legyen minden irányba. Ehhez a Syles fülön a jobb oldalon található + jelre kell kattintani és akkor létrejön egy új szabály ahol megadhatjuk a selectort és a beállításokat is.
+* Vegyünk fel egy új szabályt, amiben megadjuk, hogy a táblázat cellák `td` paddingja 1rem legyen minden irányba. Ehhez a Styles fülön a jobb oldalon található + jelre kell kattintani és akkor létrejön egy új szabály ahol megadhatjuk a selectort és a beállításokat is.
     ``` css
     td {
         padding: 1rem;
@@ -317,7 +317,7 @@ Próbáljuk ki, mi történik, hogyha a két szabály sorrendjét felcseréljük
 
 ## 4. Feladat 
 
-Mostantól a `Feladat4` mappában lévő állományokkal dolgozz.
+Mostantól a `feladat4` mappában lévő állományokkal dolgozz.
 
 Készítsd el az alábbi ábrán látható HTML oldal designját. Figyelj rá, hogy a megvalósítás során nem alkalmazhatsz inline stílusokat, és kerüld a HTML fájl módosítását.
 
@@ -333,7 +333,7 @@ Készítsd el az alábbi ábrán látható HTML oldal designját. Figyelj rá, h
 
 ### 4.1 Layout vizsgálata
 
-Az oldalnak az alapvető elrendezése már elkészült, melyhez a formázások a **`css/main.css`** fájlban találhatók, melyekből a legfontosabbakat tekintsük is át.
+Az oldalnak az alapvető elrendezése már elkészült, melyhez a formázások a **`feladat4/css/main.css`** fájlban találhatók, melyekből a legfontosabbakat tekintsük is át.
 
 * A `html` és `body` tagen nincs margin és padding sem, és itt adtuk meg a betűtípust is.
 * A hivatkozások (`a` tagek) nincsenek aláhúzva.
@@ -366,7 +366,7 @@ A logó mellett két elemből álló **menüsor** található, ahol az elemek á
 * A menüpontok szövege legyen függőlegesen középre igazítva. (Tipp: `line-height`)
 * Ügyeljen rá, hogy görgetéskor a tartalom ne takarja ki a menüsort! (Tipp: `z-index`)
 
-#### Megvalósítás lépései
+#### A megvalósítás lépései
 
 1. A fejléchez alapvető kinézetének beállítása.
     * Készíts egy `.page-header` CSS osztályt amit tegyél rá az első `header` tagre.
@@ -389,7 +389,7 @@ A logó mellett két elemből álló **menüsor** található, ahol az elemek á
         }
         ```
 
-2. Fejlécen belüli layout kialakítása.
+2. A fejlécen belüli layout kialakítása.
     * Készíts egy `.logo` CSS osztályt, amit rendelj a fejlécben lévő képhez.
     * A CSS osztályan igazítsd balra a képet úgy, hogy mellé fel tudjon csúszni felsorolás.
     ??? info "Segítség"
@@ -413,7 +413,7 @@ A logó mellett két elemből álló **menüsor** található, ahol az elemek á
         * Az egyes elemek közötti távolságokra a `padding`-ot érdemes használni.
         * Függőleges igazításhoz a `line-height`-t kell beállítani a fejléc magasságára. (60px)
 
-4. Navigációs linkek színének beállítása
+4. A navigációs linkek színének beállítása
     * A fejlécben lévő navigációs linkek legyenek fehér színűek, a betűméter pedig 1.1em
     * Ha egy menupont (link) fölé visszük az egeret, akkor a betű színe legyen szürke.
 
@@ -422,7 +422,7 @@ A logó mellett két elemből álló **menüsor** található, ahol az elemek á
 !!! example "4. feladat - Fejléc beadandó (1 pont)"
     Commitolja a `index.html` és `navbar.css` fájlokat a repositoryba!
 
-    Demonstrálja képernyőképpel a megoldást! **`f4-2.png`**
+    Demonstrálja képernyőképpel a megoldást! **`f4-1.png`**
 
 ### 4.3 Fő hír megjelenítése
 
@@ -460,7 +460,7 @@ A kezdőoldalon a legfrissebb hír jelenik meg.
 #### Beadandó
 
 !!! example "4. feladat - Hír szövege beadandó (1 pont)"
-    Demonstrálja képernyőképpel a megoldást! **`f4-3.png`**
+    Demonstrálja képernyőképpel a megoldást! **`f4-2.png`**
 
 ### 4.4 Oldalsó sáv
 
@@ -483,13 +483,13 @@ Az oldalsó sáv megjelenítését is a `news.css` fájlba készítsd el.
 #### Beadandó
 
 !!! example "4. feladat - Oldalsó sáv beadandó (1 pont)"
-    Demonstrálja képernyőképpel a megoldást! **`f4-4.png`**
+    Demonstrálja képernyőképpel a megoldást! **`f4-3.png`**
 
 #### IMSc Beadandó
 !!! example "4. feladat - Oldalsó sáv beadandó (1 IMSc pont)"
     * Ha az oldalsó hír címe rövid, akkor a tartalmi rész felcsúszik alá a `float` miatt. Készítsd szabályt, ami a HTML módosítása nélkül az oldalsó sávban lévő hírek fejléce után törli a floatolást.
     * Használt a `::after` -t a megoldáshoz
-    Demonstrálja képernyőképpel a megoldást! **`f4-4-iMsc.png`**
+    Demonstrálja képernyőképpel a megoldást! **`f4-3-iMsc.png`**
 
 ### 4.5 Reszponzivitás
 
@@ -506,4 +506,4 @@ Egészítse ki a `main.css` fájlt úgy, hogy ha 900px-nél kisebbre állítjuk
 #### Beadandó
 
 !!! example "4. Feladat - Reszponzivitás beadandó (0.5 pont)"
-    Demonstrálja képernyőképpel (**`f4-5.png`**), hogy 900px alatt nem látszódik a jobb oldali hasáb.
+    Demonstrálja képernyőképpel (**`f4-4.png`**), hogy 900px alatt nem látszódik a jobb oldali hasáb.