» »

DIV class - pozicioniranje

DIV class - pozicioniranje

Klemen1602 ::

Pozdravljeni!
Nekaj časa (preden sem spoznal da obstaja css) sem iste zadeve urejal z HTML tabelami, sedaj pa bi se rad naučil tega v css-u.

Torej ne vem kako naj postavim 3 različne div-e skupaj. Če jih enostavno prilepim enega zraven drugega, so vsi v drugi vrstici, jaz pa bi rad npr. da bi 400px velik div bil na vrhu, en 200px širok bi bil na levi strani in drugi 200px širok div pa bi bil na desni strani, med njimi pa ne bi smelo biti razmaka.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">
div.vrh
{
width:400px;
height:15px;
padding:1px;
border:1px solid grey;
font-size:13px;
}

div.levo
{
width:200px;
padding:3px;
border:1px solid blue;
margin:0px;
}

div.desno
{
width:200px;
padding:3px;
border:1px solid gray;
margin:0px;
}

</style>
</head>
<body>

<div class="vrh"><marquee>To naj bi bilo na vrhu.</marquee></div>
<br />

<div class="levo">Tole je levi stolpec levo.</div>
<br/>

<div class="desno">Tole je desni stolpec.</div>
<br/>

</body>
</html>


Že v naprej se vam zahvaljujem za pomoč,
Klemen

kogledom ::

Poglej malo v css za display ter float. Div je privzeto display:block torej gre vsak naslednji v svojo vrsto, span je pa privzeto display:inline.
To kar hočeš boš dosegel z float:left in float:right na div-u.
Tutorial

urosz ::

tako naprimer:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style type="text/css">

#vrh
{
width:400px;
height:15px;
border:1px solid grey;
font-size:13px;
}
 
#levo
{
width:200px;
border:1px solid blue;
margin:0px;
float: left;
}

#desno
{
width:200px;
border:1px solid gray;
margin: 0px;
margin-left: 200px;
}
 
</style>
</head>
<body>
 
<div id="vrh"><marquee>To naj bi bilo na vrhu.</marquee></div>
 
<div id="levo">Tole je levi stolpec levo.</div>

<div id="desno">Tole je desni stolpec.</div>
 
</body>
</html>


Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
!

Vse, kar ste si želeli vprašati o CSS, pa si niste upali. (strani: 1 2 3 423 24 25 26 )

Oddelek: Izdelava spletišč
1298344186 (3323) sunniegoldie
»

Prikaz strani na različni resoluciji-Joomla

Oddelek: Izdelava spletišč
151926 (1654) kr?en
»

Wampserver in Firefox

Oddelek: Izdelava spletišč
61831 (1711) jonystar
»

CSS - DIV - Brez Tabele

Oddelek: Izdelava spletišč
231579 (1282) jernejp
»

Poravnava znotraj DIV

Oddelek: Izdelava spletišč
91652 (1533) alum

Več podobnih tem