mi3dot.org :: View topic - CSS: pozicioniranje na dno

Forum FAQ

Memberlist

Forum ignore list

Profile

CSS: pozicioniranje na dno

This forum is locked: you cannot post, reply to, or edit topics.

This topic is locked: you cannot edit posts or make replies.

mi3dot.org Forum Index -> Client-side

View previous topic :: View next topic

Author

Message

xpi

Joined: 21 Jan 2004
Posts: 33

Posted: 27.05.2004 14:58 Post subject: CSS: pozicioniranje na dno

Kako možemo pomoću CSS-a neki element vezati uz donji rub njegovog "roditelja"?

Naprimjer, treba pozicionirati ovu crvenu kockicu na dno pravokutnika. I kockica i pravokutnik imaju fiksne dimenzije:

U dobrom starom načinu rada s tablicama to bi bilo zapravo ovo:

Code:

<td valign="bottom" align="center">
(crvena kockica)
</td>

Ali kako sad to isto izvesti pomoću CSS-a? Kako se zadaje da nešto treba ići na dno?

zytzagoo
mi3.crew

Joined: 25 Aug 2003
Posts: 1842
Location: Zagreb, Hrvatska

Posted: 27.05.2004 15:39 Post subject:

Elementi se mogu pozicionirati u odnosu na njihovog pozicioniranog parenta.

Dakle, u ovom slucaju, buduci da si rekao da su fixnih dimenzija, mozes napraviti sljedece, iako vjerojatno postoji i bolje rjesenje, ovo mi prvo pada na pamet:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="iso-8859-2"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hr-HR" lang="hr-HR">
<head>
<title>Test</title>
<style type="text/css" media="screen">
.parent {
width: 125px;
height: 55px;
border: 1px dotted black;
background-color: white;
position: relative;
}

.child {
width: 25px;
height: 25px;
background-color: #f00;
margin: 0px auto; /* postavlja ga na sredinu */
position: relative;
/* visina parent elementa - visina child elementa = 30 */
top: 30px;
}
</style>
</head>
<body>
<div class="parent">
<div class="child"></div>
</div>
</body>

Prvo sam mislio da ce biti jos jednostavnije, pa se moze postaviti bottom: 0px; property .child elementu, medjutim to mi nije radilo as expected. Radi ako korists apsolutno pozicioniranje, ali ja to izbjegavam, jer elementi izlaze iz normal flowa.

Guglaj malo "css positioning", ima toga za citati kolko ti srce zeli Smile

_________________
[+]I[+]am[+]my[+]own[+]religion[+]

Display posts from previous:

	mi3dot.org Forum Index -> Client-side	All times are GMT + 1 Hour
Page 1 of 1

You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum