Zarovnanie v html

cawte...
html nepatri do mojej parkety a ovladam ho len zbezne...

tak sa chcem opytat ako sa da zarovnat objekt na stred stranky a to tak ze bude zarovnany aj horizontalne a aj vertikalne..
na horizontalne pouzivam <center> ale vertikalne zarovnat neviem... chcem dosiahnut aby sa objekt pri akom kolvek rozliseny monitora na stranke centroval presne do jej stredu aj vodorovne aj zvislo...

dakujem

TGiJack

ahoj ten center si zmaž zo stranky nahrad ho napr: tagom DIV a pomocou CSS sa to da nádherne vycentrovat ,stači ak použijes Margin

ja hladam co najmenej komplikovanu metodu.. automatickeho zarovnania do absolutneho stredu stranky... potrebujem to ja Flash intro.. cize zarovnavat budem <object> a <param>.. a ktomu CSS no ja by som rad to co hovoris ale ja som na tito veci total lavy ako su kaskady..

TGiJack

tu je ako jednodychy priklad

Kód: Vybrať všetko

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style>
body { 
  margin: 0; 
  text-align: center;
 }
.stred {
  width: 700px; 
  background-color: #FF6600; 
  margin: 200px auto; 
}
</style>
  </head>
<body>

<div class="stred">

Obsah stránky

</div>

</body>

</html>

.stred { width: 700px;..... margin: 200px auto; tam kde je tých 200px to je vlastne o kolko ma byt stranka posunuta od vrchu a "auto" je kolko ma byt posunuta od kraja takze všetko čo napišeš teraz medzi ten div bude v strede a 200px posunute od vrchu
ak chceš niečo konkretne vysvetlit tak sa opítaj
}

je to good ale aj tak musim rucne nastavovat o okolko pixelov sa ma zvislo posunut

Kód: Vybrať všetko

margin: 200px auto;

... nie je nie co take ze bi sa to zarovnalo automaticky? lebo pri rozliseni 1024x768 to je napr. good ale ked si stranku otvorim na 1680x1050 tak to neni v strede ale zase o nieco hore..

edit//

Kód: Vybrať všetko

margin: 200px auto;

neda sa namiesto 200px pouzit dako auto? skusal som ale nejde to

TGiJack

stači ak to 200 zmeniš napriklad na 5% a jeto bude sa ti to automaticky zväčšovat podla rozlišenia

čiže novy zápis bude takýto

Kód: Vybrať všetko

margin: 5% auto;

skús niečo takéto

Kód: Vybrať všetko

<table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
  <tr>
    <td align="center" valign="middle">
       <table cellspacing="0" cellpadding="2" border="0">
         <tr>
            <td>
                  obsah stranky by mal byt vzdy v strede
            </td>
         </tr>
       </table>
    </td>
  </tr>
</table>

TGiJack

beluský napísal:skús niečo takéto
Kód: Vybrať všetko
<table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
.......
</table>

aj toto je riešenie velmi pomale lebo niektore prehladače ti nezobrazia stranku pokym nenačitaju celu tabulku, aj ked v dnešnej dobe je to uz celkom jedno ..ked už ma každy rýchli internet..
ale ako kto chce mne sa lepšie pracuje z div/span a tabulky pouzivam len na formulare,tabulky a nejake tie menšie pracičky

ano to stymy precentamy 18% auto funguje teda aspon zatial dakujem velmy pekne...

beluský napísal:skús niečo takéto

Kód: Vybrať všetko

<table border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
  <tr>
    <td align="center" valign="middle">
       <table cellspacing="0" cellpadding="2" border="0">
         <tr>
            <td>
                  obsah stranky by mal byt vzdy v strede
            </td>
         </tr>
       </table>
    </td>
  </tr>
</table>

Trochu mimo témy, ale napadlo mi, čo by robili "tvorcovia" webových stránok, keby všetky prehliadače začali spracovávať height=100% presne tak, ako by to spracovávať mali (a teda v podstate by to ignorovali).

Mmartin

Načo do toho pcháte css....

Kód: Vybrať všetko

<html>
 <head>
 </head>
 <body>
<div align="center">
Stred
</div>
<div align="left">
Left
</div>
<div align="right">
Right
</div>
   </body>
</html>

a máš to

TGiJack

Mmartin napísal:Načo do toho pcháte css....
Kód: Vybrať všetko
<html>
 <head>
 </head>
 <body>
<div align="center">
Stred
</div>
<div align="left">
Left
</div>
<div align="right">
Right
</div>
   </body>
</html>
a máš to

prepač že kazim tvoju radost ale on to chcel aj vertikalne umiestnit do strebu

a ty si to dal len horizontálne

preto to CSS

neoiron

Potreboval by som pomoc, nevyznam sa v tom a ked som uz googlil a myslel som, ze to mam tak mi to neslo. Potrebujem hodit klikatelne odkazy na stranku v takomto tvare:

hojko hojko hojko
hojko hojko
hojko

Ako docielit, aby som mal medzi odkazmi rovnake medzery v stlpcoch/aby to bolo zarovnane. Tiez nejaky kod, ktorym si urcujem aka ta medzera ma byt velka. Ak by bol niekto taky dobry a urobil mi tieto 3 riadky a ja si tam uz dosadim svoje texty a linky. Googlil som, no nejak neuspesne, myslel som ze by to mohlo ist cez tabulku (<table>, <tr>, <td>...) no to mi zarovnalo iba ak tam bol text, nie klikatelny odkaz. K+ samozrejmostou. Dakujem za kazdu pomoc, kedze toto vobec neovladam.

harrison314

neoiron napísal:Potreboval by som pomoc, nevyznam sa v tom a ked som uz googlil a myslel som, ze to mam tak mi to neslo. Potrebujem hodit klikatelne odkazy na stranku v takomto tvare:

hojko hojko hojko
hojko hojko
hojko

Ako docielit, aby som mal medzi odkazmi rovnake medzery v stlpcoch/aby to bolo zarovnane. Tiez nejaky kod, ktorym si urcujem aka ta medzera ma byt velka. Ak by bol niekto taky dobry a urobil mi tieto 3 riadky a ja si tam uz dosadim svoje texty a linky. Googlil som, no nejak neuspesne, myslel som ze by to mohlo ist cez tabulku (<table>, <tr>, <td>...) no to mi zarovnalo iba ak tam bol text, nie klikatelny odkaz. K+ samozrejmostou. Dakujem za kazdu pomoc, kedze toto vobec neovladam.

daj to do neviditelnej tabulky,
tam kde maju byt policka prazdne daj  

Príspevok od používateľa **Grim** » 04 okt 2012, 19:07

...daj sem kód tej tabuľky...tabuľka zarovnáva aj odkazy a obrázky...niečo si tam podľa mňa robil zle...

neoiron

Grim dakujem, pozrel som sa na to este raz a skutocne som to urobil zle. Kedze sa v tom nevyznam tak som myslel, ze to v tabulke byt nemoze

harrison314 dakujem za tip

Tabuľky? To ako vážne?

Kód: Vybrať všetko

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>        
  <head>              
    <meta http-equiv="content-type" content="text/html; charset=utf-8">       
    <title>test</title>    
    <style type="text/css">    
      <!--
          .stlpec{float:left;padding:0 5px;}
      //-->    
    </style>     
  </head>     
  <body>       
    <div class="obal">             
      <div class="stlpec">               
        <a href="#">hojko1</a>
        <br>       
        <a href="#">hojko1</a>
        <br>       
        <a href="#">hojko1</a>               
      </div>       
      <div class="stlpec">               
        <a href="#">hojko2</a>
        <br>       
        <a href="#">hojko2</a>               
      </div>       
      <div class="stlpec">               
        <a href="#">hojko3</a>               
      </div>              
    </div>            
  </body>
</html>

Takto to vyzerá:

: 01.png (1.15 KiB) 1774 zobrazení

Alebo

Kód: Vybrať všetko

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>        
  <head>              
    <meta http-equiv="content-type" content="text/html; charset=utf-8">       
    <title>test</title>    
  </head>     
  <body>       
    <div class="obal">             
      <div>               
        <a href="#">hojko1</a>       
        <a href="#">hojko1</a>       
        <a href="#">hojko1</a>               
      </div>       
      <div>               
        <a href="#">hojko2</a>       
        <a href="#">hojko2</a>               
      </div>       
      <div>               
        <a href="#">hojko3</a>               
      </div>              
    </div>            
  </body>
</html>

Takto to vyzerá:

: 02.png (1.16 KiB) 1774 zobrazení

BX · Príspevok od používateľa BX » 04 okt 2012, 22:24

Čo máš proti tabuľkám? Kým do nich nepchá kopu javascriptu, je to dosť jedno.

Možno dosť subjektívny názor ale ak robíš dynamickú stránku (čo v tomto prípade nevieme ale v dnešnej dobe to je viac ako isté) ktorá sa generuje, tak sa omnoho lepšie pracuje s blokmi ako s TD. Nejde ani tak o to čo je obsahom ale o princíp samotný. Samozrejme ak chcem robiť cenník alebo výsledky zápasov, tak sa nad tým zamyslím, ale toto nič podobné asi nebude.

neoiron

weroro dakujem za kody, ten prvy by sa mi hodil viac, no ked ho skopirujem tak mi vsetky odkazy da pod seba a nevytvori stlpce. Ten druhy ide perfektne. Chyba je niekde u mna takze asi ostanem pri tabulke

Ak by mi to, ale islo niekedy tak medzery medzi stlpcami si upravujem tymto? stlpec{float:left;padding:0 5px;}

Este k tym tabulkam, to je prve co som vygooglil a pre absolutneho neznalca html kodu mi to prislo najprijatelnejsie na nahodenie.

Zatial som chcel dat iba klikatelne odkazy, neskor mozno aj obrazky, aby ste mali predstavu co vlastne chcem, tak take nieco:

http://www.visitslovakia.com/partneri/

Zarovnanie v html

Zarovnanie v html

Re: Zarovnanie v html

Re: Zarovnanie v html

Re: Zarovnanie v html

Re: Zarovnanie v html

Re: Zarovnanie v html

Re: Zarovnanie v html

Re: Zarovnanie v html

Re: Zarovnanie v html