Mr.SergE Posted June 7, 2007 Report Share Posted June 7, 2007 Ir sekojošs izklājuma plānojums: 100% platums. Vai kāds var sniegt padomu, kādā veidā pareizāk būtu būvēt CSS priekš tāda izklājuma? T.i. - nu es saprotu, footeris ir vienkārši clear:both;, bet kā ir ar to labo fiksēta platuma sleju - vai to ievietot vienā divā ar pārējiem bokšiem vai arī atsevišķi nopozicionēt, un vispār, cik man tur divi viens iekš otra ir jālīmē kopā, lai viss sanāktu ok un uz dažādiem pārlūkiem man tur tās detaļas neaizpeldētu katra uz savu pusi? Link to comment Share on other sites More sharing options...
v3rb0 Posted June 7, 2007 Report Share Posted June 7, 2007 režģis, table, grids.. it kā līdzīgi. izmanto to kas labāk der, nevis to kas skaitās "krutāk". Link to comment Share on other sites More sharing options...
andrisp Posted June 7, 2007 Report Share Posted June 7, 2007 v3rb0, fui par tādu domāšanu. Ja ir iespējams CSS izkārtojums, tad kāpēc no tā atteikties par labu table izkārtojumam, tikai tāpēc, ka ar table tas būs ātrāk ? Jā, es zinu, ka laiks ir nauda. Bet nu bez-teiblju dizains atmaksājas arī vēlāk kad saits ir jāupgreido. Link to comment Share on other sites More sharing options...
Mr.SergE Posted June 7, 2007 Author Report Share Posted June 7, 2007 pilnīgi piekrītu andrisp, tieši tāpēc arī mēģinu tagad izurbties cauri tam visam pasākumam tā, lai viss sakarīgi saveidotos. Link to comment Share on other sites More sharing options...
v3rb0 Posted June 7, 2007 Report Share Posted June 7, 2007 (edited) it kā izmantojot apakšā tabli par gridu nevarētu lietot css. tables variantā te būs ne vairāk par 7 cellēm ar colspan/rowspan, bet nebūs ne vienu reizi float, position un daudzie margin/paddingi. css būs īsāks un tīrāks, nekā tad ja izmantos "pareizo" pieeju. par labošanu, ļoti atkarājas kas jāmaina, ja tables htmls ir noidentēts pareizi un nav aizbraukts auzās ar table iekš tables, tad labot nevajadzētu būt grūti. un nebūs jaņemas ar marginus/paddingu pārrēķināšanu visiem elementiem, mainīt floatus, elementu secību utt. Edited June 7, 2007 by v3rb0 Link to comment Share on other sites More sharing options...
andrisp Posted June 7, 2007 Report Share Posted June 7, 2007 (edited) ok, šitās table layout vs. css layout diskusijas jau ir linux vs. windows līmenī. Edited June 7, 2007 by andrisp Link to comment Share on other sites More sharing options...
mefisto Posted June 7, 2007 Report Share Posted June 7, 2007 Cik maksāsi, ja uztaisīš' ? Kas attiecas uz tables VS layers , tad tas nebūt nav klasiskais ticvības karš (amd/intel , linux/windows , pc/mac .. utt). Šoreiz ir daudz neapgāžamu argumentu, un tie, kas saka, ka ar tabulu ir vienkāršāk, laikam nekad nav mēģinājuši salīdzinat kā atšķiras layer un table layouts, tad kad tajā stūķē iekšā php (vai kādu citu valodu). Link to comment Share on other sites More sharing options...
nemec Posted June 7, 2007 Report Share Posted June 7, 2007 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>-</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="main_layout.css" /> </head> <body> <div id="outer"> <div id="left"> left<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> </div> <div id="right"> <div id="rightfl"> <div id="rightflc"> right1<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> </div> </div> <div id="rightfr"> right2<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> </div> </div> <div id="clearheader"></div> <!-- to clear header --> <div id="centrecontent"><!--centre content goes here --> <div id="centers"> CENTER </div> </div> <div id="clearfooter"></div> <!-- to clear footer --> </div><!-- end outer div --> <div id="footer"> <div id="footers"> footer </div> </div> <div id="header"> <div id="headerp"> <div id="headertop"> header1 </div> <div id="headerbottom"> header2 </div> </div> </div> </body> </html> main_layout.css * { padding: 0px; margin: 0px; color: #000000; border: 0px; font-family: arial; font-size: 12px; line-height: 17px; word-spacing: 2px; } a:hover { text-decoration: none; } a:active, a:focus { outline: none; } html, body { height: 100%; } ul { list-style: none; } .cl { clear: both; height: 0px; line-height: 0px; font-size: 0px; } #outer { height:100%; min-height:100%; margin-left:180px; margin-right:360px; margin-bottom:-50px; background-color: #f7ffd6; } html>body #outer{height:auto;} /*for mozilla as IE treats height as min-height anyway*/ #header { position:absolute; top:0; left:0; width:100%; height:72px; overflow:hidden; } #headerp { padding-right: 180px; } #headertop { height: 36px; background-color: #effaac; } #headerbottom { height: 36px; background-color: #97a16c; } #left { position:relative;/*ie needs this to show float */ width:180px; float:left; margin-left:-179px;/*must be 1px less than width otherwise won't push footer down */ padding-top:72px;/*needed to make room for header*/ background-color: #e8edad; } #right { position:relative;/*ie needs this to show float */ width:360px; float:right; margin-right:-359px;/*must be 1px less than width otherwise won't push footer down */ padding-top:0px;/*needed to make room for header*/ } #rightfr { float:right; width:180px; background-color: #c1a78c; } #rightfl { float:left; width:180px; padding-top: 72px; } #rightflc { background-color: #e8edad; } #footer { width:100%; clear:both; height:50px; position:relative; background-color: #eef9ab; } * html #footer {/*only ie gets this style*/ \height:52px;/* for ie5 */ he\ight:50px;/* for ie6 */ } #clearheader{height:72px;}/*needed to make room for header*/ #clearfooter{clear:both;height:40px;}/*needed to make room for footer*/ * html #centrecontent {height:1%;margin-bottom:12px;}/* combat IE's 3 pixel jog */ aiznjeema 25 min. neesu paaarliecinaats, ka viss straadaa. apskatiijos tikai uz FF2 un IE6 Link to comment Share on other sites More sharing options...
Kavacky Posted June 7, 2007 Report Share Posted June 7, 2007 Esmu par tabulu izmantošanu tabulu attēlošanai. Bet principā jau lietotājam pofig, kas tur ir apakšā, ka tik izskatās smuki. Toties ar tabulu tu, šķiet, fiksi nevari apmainīt kreiso kolonnu ar labo ar iejaukšanos tikai un vienīgi CSS. Link to comment Share on other sites More sharing options...
GedroX Posted June 8, 2007 Report Share Posted June 8, 2007 Tabulas izmanto tie, kas nemāk pareizi izmantot div. Tad, protams, ar tabulām būs vienkāršāk/ mazāk problēmu, pārlūkprogrammu atšķirību utml. Link to comment Share on other sites More sharing options...
king999 Posted June 8, 2007 Report Share Posted June 8, 2007 Un tāpēc, ka tas skaitās "krutāk" vajag lietot divus, un ja daudz ērtāk un bez galvassāpēm var izveidot ar tabulām. Man šķiet, ka tas ir bezjēdzīgs strīds. Katrs dara kā ērtāk, un viss. Link to comment Share on other sites More sharing options...
GedroX Posted June 8, 2007 Report Share Posted June 8, 2007 Un tāpēc, ka tas skaitās "krutāk" vajag lietot divus, un ja daudz ērtāk un bez galvassāpēm var izveidot ar tabulām. Man šķiet, ka tas ir bezjēdzīgs strīds. Katrs dara kā ērtāk, un viss. Kad māki, tad daudz ērtāk un bez galvassāpēm ir taisīt layout-u ar div-iem. Es ar div-iem īsti nemāku vēl apieties. Pašam sanāk ātrāk ar tabulām taisīt. Bet, ja nu nāktos par HTML koderi piestrādāt, iemācītos. Link to comment Share on other sites More sharing options...
andrisp Posted June 8, 2007 Report Share Posted June 8, 2007 (edited) Man šķiet, ka tas ir bezjēdzīgs strīds. Katrs dara kā ērtāk, un viss. Nu taa iisti arii nav. Table based izkaartojumu probleemas: - table layoutus ir problemaatiskaak apluukot text based browseros (mobilie devaisi utt). Protams, tas stipri ir atkariigs no auditorijas, vai sho faktoru vajag vai nevajag njemt veeraa. - ja templeishu sisteema tiek buuveeta no html "gabalinjiem", tad neizbeekami sanaak, ka vienaa templeitu gabaalaa sanaaks <table> start tags, bet citaa </table> end tags utt. Tas veido haosu un nepaaredzamiibu. Protams, tas ir stipri atkariigs arii no taa, kaa cilveeks veido markupu. Ja visas lapas ir praktiski ar vienaadu struktuuru, tad shii probleema nav tik izteikta. Bet ja katra lapa saitaa ir ar ljoti atshkjiriigiem izkaartojumiem, tad beigaas tajos visos colspanos un rowspanos tu apmaldiisies. - table layouts nav tik fleksibls izmainjaam. Veelaak ja kautkur veeleesies ievietot kaadu jaunu bloku (<td>) kaadaa lapaa, tad var gadiities, ka ir jaapieregulee citu bloku rowspani un colspani. (Protams, shis un ieprieksheejais punkts ir stipri atkariigi no html koda un developera iemanjaam. - table layouti ljoti biezhi ir smagaaki un ar vairaak nevajadziiga markapa nekaa css based analogs layouts. - table layouts nevar kustomizeet neiejaucoties html struktuuraa. - table layoutu izvietojums ljoti biezhi ir nesemantisks (table prieksh jau izvietojuma jau vien ir nesemantiski, bet w3c rekomendaacijas saka, ka, ja izstripojot table tagu un ar to saistiitos tagus, lapas saturs raadaas semantiskaa seciibaa, tad table layouts veel ir pieljaujams). Tas atsaucaas arii uz pirmo punktu. Shobriid vairaak iemeslu neatsaucas praataa. Edited June 8, 2007 by andrisp Link to comment Share on other sites More sharing options...
GedroX Posted June 8, 2007 Report Share Posted June 8, 2007 Desmitniekā. Link to comment Share on other sites More sharing options...
andrisp Posted June 8, 2007 Report Share Posted June 8, 2007 Vieniigie plusi tabulaam, ko es speeju iedomaaties: - aatraak var dabuut gatavu izkaartojumu (bet shis ir subjektiivs. augot browseru css atbalstam un izstraadaataaja iemanjaam, css layouti arii aatri buuvejas) - Viegli implementeet vertikaalo centreeshanu, kur vajag. (Kaut gan prieksh css ir dazhaadi risinaajumi, neviens no tiem nav pilniigs) - Viegli veidot layoutus, kur ir svariigi (vismaz vizuaali), lai divaam vai vairaakaam blakusesoshaam kolonnaam buutu vienaads augstums, neatkariigi no satura. Bet ieksh css ar dazhaadaam metodeem arii sho nav paaraak gruuti panaakt. Ir tikai jaapguust shiis metodes. Link to comment Share on other sites More sharing options...
Recommended Posts