Zefirs Posted June 17, 2011 Report Share Posted June 17, 2011 (edited) Vēlos lai attēli mainot loga izmēru vienmēr būtu centrā, un ja attēli vairāk nekā ietilpst vienā līnijā tad lai otrā līnija sāktos no kreisās puses . Problēma tāda ka 1. līnija ir centrēta ja attēli ir tik daudz lai ietilptu visi vienā līnijā, bet kā nepieciešams pievienot jaunu līniju tā uzreiz centrēšana tiek pārtraukta. Attēlā redzams ka labajā pusē ir daudz lielāka atstartpe. Edited June 17, 2011 by Zefirs Quote Link to comment Share on other sites More sharing options...
daGrevis Posted June 17, 2011 Report Share Posted June 17, 2011 http://www.wpdfd.com/editorial/thebox/deadcentre4.html Quote Link to comment Share on other sites More sharing options...
Zefirs Posted June 17, 2011 Author Report Share Posted June 17, 2011 Dotais piemērs nekādu skaidrību nerod, centrēt fixed size ir ka apmīst divus pirkstus. Bet ja attēli ir garā rindā vieni aiz otra un loga izmēru var mainīt, tad kā panākt lai tas viss brīnums būtu centrēts? Quote Link to comment Share on other sites More sharing options...
daGrevis Posted June 17, 2011 Report Share Posted June 17, 2011 Tāpat neiet? Quote Link to comment Share on other sites More sharing options...
daGrevis Posted June 17, 2011 Report Share Posted June 17, 2011 Kāds "position" ir attēliem, visam pārējam? P.S. Tev vajag to visu gan horizontāli, gan vertikāli tieši pa vidu visos iespējamajos ekrāna lielumos? Quote Link to comment Share on other sites More sharing options...
Kemito Posted June 18, 2011 Report Share Posted June 18, 2011 Nu sāc izstādīt kodu, lai var palīdzēt palabot tev viņu . Quote Link to comment Share on other sites More sharing options...
Maris-S Posted June 18, 2011 Report Share Posted June 18, 2011 Tas ko Tu mēģini panākt ir sarežģīti izdarāms tikai ar CSS, nezinu vai vispār iespējams. Domāju, ja arī atradīsi risinājumu, tad noteikti tas būs ar daudziem diviem apkārt, lai kaut kādā veidā centrētu vajadzīgo saturu. Visvienkāršākais veids kā to izdarīt ir tabula, kaut arī mūsdienās nav tik populāra izkārtojumam, bet viņa strādās un pat uz visiem pārlūkiem. Domāju ka tādu datu izvietojumu, ko Tu centies sasniegt daļēji var uzskatīt arī par tabulāriem datiem, jo visumā veidojas tabula, bet nu tas vai izmantot vai neizmantot tabulu ir jau gandrīz kā reliģisks jautājums, tā ka izvēlies pats. Tuvākais risinājums ar CSS ir izmantot inline-block div elementus, bet tomēr tas neļaus sasniegt ko vēlies, jo, piemēram, ja pēdējā rindā būs par vienu div elementu mazāk, tad rinda nebūs piespiesta kreisajai malai. Uz visiem pārlūkiem nepārbaudīju. Tālāk kods. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Centered divs</title> <style type="text/css"> div#container { text-align: center; } div#container div { width: 300px; height: 150px; margin: 0px 5px 5px 0px; background-color: lime; display: inline-block; } </style> </head> <body> <div id="container"> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </div> </body> </html> Vēl viens risinājums ir papildināt CSS ar javascript, tad gan jau ka varētu panāk vēlamo rezultātu, mūsdienās javascript ir diezgan izplatīts, tā ka nebūs daudzi, kam viņš būs atslēgts, arī izveido dizainu tā, lai ar izslēgtu javascript viss strādātu, bet nenotiktu centrēšana, vienkārši tie, kam nebūs javascripts, redzēs saturu mazliet nobīdītu uz kreiso malu, bet lielākā daļa redzēs normālu izskatu. Visumā cik esmu redzējis tādas mājas lapas, pārsvarā ir necentrētas, tā ka javascript izmantošana šajā gadījumā ir pieņemama. Piemēram 2u.lv, saturs tiek attēlots no kreisās malas, mainot pārlūka izmēru var redzēt ka nekāda centrēšana nenotiek. Quote Link to comment Share on other sites More sharing options...
Zefirs Posted June 19, 2011 Author Report Share Posted June 19, 2011 (edited) Centrēt visu ir iespējams ar http://css-tricks.com/2007/12/centering-list-items-horizontally-slightly-trickier-than-you-might-think-361 , bet likt otrajai rindai būt kreisajā malā vienā līnijā pēc centrētās 1. līnijas kreisās malas ir neiespējami. Otrs variants bija tāds kādu aprakstīja Maris-S , taču centrēšana zūd pie ja parādās otrā līnija. Atliek vien meklē kādu js atrisinājumu.. Edited June 19, 2011 by Zefirs Quote Link to comment Share on other sites More sharing options...
Snapins Posted June 19, 2011 Report Share Posted June 19, 2011 Containerim var pierakstīt šādi - margin:0 auto; Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.