Autor | Zpráva | ||
---|---|---|---|
mardon Profil |
#1 · Zasláno: 23. 6. 2008, 14:49:08
Poradťe prosím příklad na centrovaný 3 sloupcový layout pro pevnou šířku webu 780 px.
Předem díky |
||
Manq Profil |
#2 · Zasláno: 23. 6. 2008, 14:51:40
|
||
kletely Profil |
#3 · Zasláno: 23. 6. 2008, 14:52:23
mardon
No yle asi si ho budeš musieť upraviť :) ukážka: http://css.interval.cz/priklady/priklad-9-1.htm Kód a popis: http://css.interval.cz/clanky/vychytany-trisloupcovy-fluidni-layout-se -stejnou-delkou-panelu/ |
||
mardon Profil |
#4 · Zasláno: 23. 6. 2008, 15:03:33
Ano, ale co kdybych chtela mit obsah jako prvni sloupec?
|
||
kletely Profil |
#5 · Zasláno: 23. 6. 2008, 15:05:20
mardon
No tak si ich vymeň/uprav. |
||
mardon Profil |
#6 · Zasláno: 23. 6. 2008, 15:24:41 · Upravil/a: mardon
|
||
kletely Profil |
#7 · Zasláno: 23. 6. 2008, 15:27:48
mardon
No už je vycentrovaný :) |
||
rommy Profil * |
#8 · Zasláno: 23. 6. 2008, 15:29:37
zde je taky něco :-)
http://blog.html.it/layoutgala/ |
||
mardon Profil |
#9 · Zasláno: 23. 6. 2008, 15:36:47
No už je vycentrovaný :)
Doplňuji: Myslela jsem centrovaný s pevnou šířkou |
||
kletely Profil |
#10 · Zasláno: 23. 6. 2008, 15:38:54
mardon
Centruje sa tak to: http://tiso.wz.cz/articles/vycentrovanie-obsahu-stranky.php A pevnú šírku si snať sama nastavíš? Keby si nevedal tak to sa robí pomocou width :) |
||
Časová prodleva: 7 dní
|
|||
mardon Profil |
#11 · Zasláno: 30. 6. 2008, 15:14:22
Centruje sa tak to: http://tiso.wz.cz/articles/vycentrovanie-obsahu-stranky.php
když to udelam podle odkazu take ve FF3.0 je to ok, ale v IE 7.0 to nefunguje. V cem je problem? |
||
Měsíček Profil |
#12 · Zasláno: 30. 6. 2008, 15:49:40
Pokud děláš centrování přesně podle této stránky ( http://tiso.wz.cz/examples/vycentrovanie-obsahu-stranky.php ) tak bude vycentrovaná .. možná ti to nejde proto, protože jsi tam nedala DOCTYPE s adresou :)
|
||
mardon Profil |
#13 · Zasláno: 30. 6. 2008, 16:15:56
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="cs" lang="cs"> <head> <meta name="keywords" content="bla bala" /> <meta name="description" content="Decsription." /> <meta name="author" content="mardon" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-language" content="cs" /> <title>co už včíl s tým</title> <link rel="stylesheet" href="css/style.css" type="text/css" /> <script src="http://www.google-analytics.com/urchin.js" type="text/javascript"> </script> <script type="text/javascript"> _uacct = "UA-59889-1"; urchinTracker(); </script> </head> <body> <div id="hlavicka">Toto je hlavička stránky.</div> <div id="container"> <div id="center" class="column"> <h1>Toto je hlavní panel</h1> <p>Lorem ipsum... </p> </div> <div id="left" class="column"> <h2>Toto je levý panel</h2> <p>Lorem ipsum... </p> </div> <div id="right" class="column"> <h2>Toto je pravý panel</h2> <p>Lorem ipsum... </p> </div> </div> <div id="paticka"> <div id="paticka-uvnitr">Toto je patička stránky.</div> </div> </body> </html> |
||
mardon Profil |
#14 · Zasláno: 30. 6. 2008, 16:16:34
body{
background: url('../images/layout/bg.gif') repeat-x; min-width: 630px; /* 2 x (LC plna-sirka + CC padding) + RC plna-sirka } #container { padding-left: 200px; /* LC plna-sirka */ padding-right: 190px; /* RC plna-sirka + CC padding */ position: relative; /* Resi "nekonecnou" stranku v IE7 */ } #container .column { position: relative; float: left; } #center { padding: 10px 20px; /* CC padding */ width: 100%; } #left { width: 180px; /* LC width */ padding: 0 10px; /* LC padding */ right: 240px; /* LC plna-sirka + CC padding */ margin-left: -100%; } #right { width: 130px; /* RC width */ padding: 0 10px; /* RC padding */ margin-right: -100%; } #paticka-uvnitr { clear: both; } /*** oprava pro IE ***/ * html #left { left: 150px; /* RC plna-sirka */ } /*** Stejna vyska sloupcu ***/ #container { overflow: hidden; } #container .column { padding-bottom: 1001em; /* X + padding-bottom */ margin-bottom: -1000em; /* X */ } /*** oprava paticky ***/ * html body { overflow: hidden; } * html #paticka { float: left; position: relative; width: 100%; padding-bottom: 10010px; margin-bottom: -10000px; background: #FFF; /*** Stejne jako u body ***/ } /*** Jen pro vzhled ***/ body { margin: 0; padding: 0; background: #FFF; } #hlavicka, #paticka-uvnitr { font-size: large; text-align: center; padding: 0.3em 0; background: #999; } #left { background: #66F; } #center { background: #DDD; } #right { background: #F66; } #container .column { padding-top: 1em; text-align: justify; } |
||
Měsíček Profil |
#15 · Zasláno: 30. 6. 2008, 16:17:56
Jsem málem z toho kódu omdlel :) .. prosímtě zkus to udělat znova a začít na tisově vycentrované šabloně, protože dosavadní kód je opravdu, ale opravdu hrůza :)
|
||
Časová prodleva: 16 let
|
0