[Homework] HTML Tables - Problem {5} - Life in SotfUni
Това упражнение ми отне повече време, отколкото всички останали от домашното. Прерових толкова много интернет, изпровах толкова много вариации на кода си и толкова много се отчаях накрая, че нещата отидоха на въпрос във форума.
1. Как да направя така, че колоните да имат една и съща дължина (width), без да ползвам css и без на всяко <td> да слагам width="" и да самоизчислявам? В реда с четирите кутии, ред 3-ти, те са с дължина според текста вътре, а искам да са еднакви. Зациклих, помощ!
2. Вложената таблица ми оразмерява целия 4-ти ред с двойна височина, спрямо остналите. Логично, защото е с 2 реда вътре. Именно такава трябва да е и височината на всеки един от редовете, но не е, без да сложа <tr height="100"> навсякъде, и пак да изчислявам и деля.
Ще ми се да подскажете някой по-хитър и културен вариант.
Ако не става ясно само кажете и ще допоясня какви са терзанията ми с това упражнение.
Така съм ги написала и въпреки това не са симетрични
<tr height="100">
<th colspan="4">
<h1><strong>SoftUni LIFE</strong></h1>
</th>
</tr>
<tr height="100">
<td colspan="2">Google</td>
<td colspan="2">GitHub</td>
</tr>
<tr height="100">
<td>FB</td>
<td>GMail</td>
<td>YouTube</td>
<td>2048</td>
</tr>
Още във въпроса трябваше да се сетя да дам линк към кода:
http://pastebin.com/vqfhNkhn
Пробвай да добавиш 'height' на <td>, а не на <tr>. Според мен там грешиш...
Най добре си направи един css файл и там си напиши td { height: 100px; } и виж как ще се промени страницата :)
Направих го и таблицата се уголеми с няколко пиксела, заради border-а.
Височината я бях нагодила по загубеняшкия начин с аритметични операции, но със сигурност има и друг начин. Т.е. височината на редовете в момента е симетрична, но остава въпроса с дължината на колоните. Не ми се ще да го правя и там така - на всеки <td> да слагам width.
Можеш да си направиш един файл 05-life-in-softuni.css, в него да добавиш например това -> td {
width: 100px;
}
В хед тага линкни css файла -> <link rel="stylesheet" href="05lifeinsoftuni.css">
И си готова :)
Много е скапано, без да се ползва css, факт... Прежалих се и сложих една стилизация в началото и се получи добре.
<style>
td
{
width: 100px;
}
</style>
Благодаря ти!
За нищо :) CSS улеснява много :) Свикни с него и ще видиш.