Elementu pozicija svetaineje

karakana7

Bendruomenės narys

Užsiregistravo Registracija: 2009-08-02

Parašė pranešimų Pranešimų forumuose: 16

Parašė komentarų: 0

Narių grupė Nariai

Tema paskelbta: 2010-07-05 21:09:08

Na va skaitau ta jau pasenusi jusu puslapio strapsni "Css savybe "position"" ir niekaip nesumastau kaip patraukti meniu blokelius i ten kur man reikia, tai yra i pati centra ir kiek zemiau, nuo virsutines tinklapio krastines ( kokiais 50-20px ), galbut jums pasirodys ir paprasta is pirmo zvilgsnio, bet as jau isbandziau visus position tipus: ir static, ir absolute, ir relative....Bet nieko nepavyko, tas meniu kaip nejuda, taip nejuda is vietos, nezinau, ka ir daryti.Kai parasau:

position: absolute;
 left: 100px;
 bottom: 50px;

Tie blokeliai "atsigula" vienas ant kito ir gaunasi kazkokia tai nesamone...O kai pabandau tai padaryti su reliative pozicija, tai is vis visas meniu dingsta, as suprantu, ka sie poziciju tipai reiskia, tiesiog jau netekau vilties, tai bandziau visus patikrinti....Dabar tiek daug rasliavos ir mazai esmes, idesiu savaji trumpa koda css ir html, o jus jei nesunku padesit ( juk vasara, zmones ilsisi ).

body {

background-color: 8ac62c;

}

.juoda_linija {

width: 800px;
height: 20px;
background-color: black;
position: absolute;
left: 300px;

}

#mygtukai {

margin: 0px auto;
 
}

ul {

list-style-type: none;

}

#mygtukai ul a {

display:block;

float: left;

width: 121px; /*plotis*/

height: 20px; /*ilgis*/

padding-top: 5px; /*atstumas nuo viršaus, mygtuko viduje*/

margin-bottom: 2px; /*atstumas nuo mygtuko apačios*/

font: 11px verdana; /*šriftas*/

font-weight: bold; /*šrifto storis*/

color:#FFF; /*šrifto spalva*/

text-align: center; /*šrifto centravimas*/

text-decoration: none; /*šriftas nepabrauktas*/

background-color: ae131e;   /*Mygtuko fonas*/

}

Html kodas:

<html>
<head>
<title="Kompiuteriai,technologijos ir ivairus pasnekesiai"></title>
<link rel="stylesheet" type="text/css" href="stiliai.css"/>
</head>
<body>
<div class="juoda_linija"></div>
<div id="mygtukai">
<ul>
<li><a href="#">Pagrindinis</a></li>
<li><a href="#">Apie mane</a></li>
<li><a href="#">Kontaktai</a></li>
<li><a href="#">Forumas</a></li>
</ul>
</div>
</body>
</html>

Dabar bent jau dirbant su mano kompiuteriu viskas atrodo taip:

Aciu uz jusu pagalba is anksto!

Atsakymai į temą