გამარჯობათ.
ახალი დაწყებული მაქვს HTML-ის და CSS-ის სწავლა და თქვენი დახმარება მჭირდება.
მოკლედ ასეთი ძალიან მარტივი სატესტო გვერდი მაქვს:
<!Doctype html>
<html>
<head>
<title>ტესტსაიტი</title>
<style type="text/css">
nav {background-color: blue; padding: 15px; text-align: center;}
nav a {text-decoration: none; color: yellow; font-weight: bold; padding: 15px;}
nav a:hover {background-color: black; color: white;}
</style>
</head>
<body>
<nav>
<a href="#">ვაშლი</a>
<a href="#">მანდარინი</a>
<a href="#">კარტოფილი</a>
<a href="#">კიტრი</a>
<a href="#">ხურმა</a>
<a href="#">ჩირი</a>
<a href="#">სტაფილო</a>
<a href="#">ნესვი</a>
<a href="#">მურაბა</a>
<a href="#">ჩაი</a>
</nav>
</body>
</html>
მინდა, რომ მენიუში "ვაშლის" და "ჩაის" შავი ფონი სანავიგაციო ბარის ბოლომდე გავრცელდეს, მაგრამ როგორც ფოტოებზე ხედავთ, გარკვეული ინტერვალი რჩება.
ვცადე ასეც: ვაშლის ლინკს გავუწერე კლასი "links" (ასე: <a href="#" class="links">ვაშლი</a>) და შემდეგ CSS-ში ეს ჩავსვი nav a.links {margin-left: 0px;}, მაგრამ არ უშველა. როგორ შეიძლება გავაკეთო? ანუ მინდა, რომ ლინკზე კურსორის მიტანისას შავი ფონი ვაშლის და ჩაის შემთხვევაში ბოლო კიდემდე მივიდეს და ლურჯი ფონი მთლიანად დაფაროს.
* * *
text-align: left-ის შემთხვევაშიც რჩება ადგილი.
* * *
მოკლედ CSS-ის კოდი გადავაკეთე შემდეგნაირად:
nav {background-color: blue; padding: 15px 0px 15px 0px; text-align: justify;}
ვაშლის ფონი კი მივიდა სანავიგაციო ბარის ბოლომდე, მაგრამ ჩაი დაშორდა მარჯვენა კიდეს. მინდა, რომ ჩაის ფონიც ბოლომდე გავრცელდეს.
* * *
უი გავაკეთეეეეეეეეე
<a href="#">ჩაი
&n
bsp; </a>
ბევრი ჩავსვი და ის შედეგი მივიღე, რაც მინდოდა.
მაგრამ კოდი ძალიან მახინჯი გამოვიდა. იქნებ სხვა მეთოდიც არსებობს, რომ ვიცოდე უბრალოდ.
ჩაინიკური კითხვები Vol. V, თუ ხარ დამწყები მოდი და აქ იკითხე
