DevProTalk - CSS vs Table - old story, but

DevProTalk

Strana 5 od 6

5

Prikažite 40 poruka iz ove teme na jednoj stani

DevProTalk (http://www.devprotalk.com/index.php)

- (X)HTML, JavaScript, DHTML, XML, CSS (http://www.devprotalk.com/forumdisplay.php?f=8)

- - CSS vs Table - old story, but (http://www.devprotalk.com/showthread.php?t=653)

borstale

11. 02. 2006. 17:37

@ivanhoe: ne radi, to je i blues predložio čini mi se...

Blood

11. 02. 2006. 18:53

Kôd:

<div id="container">

        <div id="header">header</div> 

        <div id="menu">menu right</div>

        <div id="menu_left">menu left</div>

        <div id="contents">content</div>

        <div id="footer">footer</div>

</div>

Kôd:

body {

        margin: auto;

        margin-top: 15px;

        padding: 0;

        color: black;

        font-size: 12px;

}

#container {

        width: 100%;

}

#header {

        position: relative;

        width: 100%;

        border: 1px solid blue;

}

#menu {

        float: right;

        width: 20%;

}

#contents { 

        float: left;

        width: 59.5%;

        border: 1px solid gray;

}

#menu_left {

        width: 20%;

        float: left;

}

#footer {

        clear: both;

        width: 100%;

        border: 1px solid red;

}

Prosto ?

Dragan Babić

11. 02. 2006. 19:18

@ Bojan:
Nisam mogao ranije da odgovorim (ali sam propratio sta ste pisali), ne mogu da verujem koji je tvoj problem i sta konstantno pokusavas da dokazes. Posto ni sada ne mogu da se rasplinjavam, evo ti jedan koristan link za to sto hoces oko footera:

http://www.themaninblue.com/experiment/footerStickAlt/

misk0

11. 02. 2006. 19:38

Uh... ne pogledam citav dan temu i ono 4 stranice dodate :)

Uglavnom, nije mi bila namjera zapoceti jos jedan IT flame, sta je bolje i zasto je bolje.
Neko vec rece (mislim Ilija) da su u pitanju 2 razlicita nacina razmisljanja i da nije jednostavno preci sa jednoga na drugi - prihvatam to.
Ono sto vidjam kod sajtova koji su CSS only je da je dizajn veoma jednostavan i imam osjecaj da je u tom slucaju dizajn podredjen stilu a ne obratno.
U slucaju da od dizajnera dobijes PSD/JPG fajl, koji je poprilicno komplikovan (u smislu detalja, coskova, prelaza, prostora za text i sl.) mislim da nije jednostavno napraviti CSS only sajt, pogotovo kad je rijec o pixel preciznim detaljima.

Jos nisam dobio odgovor na pitanje 'Koliko browsera (u smislu kompatibilnosti stranice) uzimate u obzir'? I kako mozete vidjeti kako izgleda stranica u recimo IE 5.0 ili Safariju koje nemam instalirane.

Br@nkoR

11. 02. 2006. 19:47

Nisam pratio temu, sada pogledah, ali bilo je reči o footeru:
http://www.devprotalk.com/t248-zalep...-browsera.html

Zero-Cool

11. 02. 2006. 21:26

Misk0 dao sam ti odgovor na pitanje o browserima i da je noramlo da pregledas u 2-3 browsera svoj sajt, ako mislis da je potrebno moze i vise, ali to povlaci za sobom komplikovano i fino podesavanje da se ta stranica vidi u svim tim browserima isto.

Sto se tice detalja i finoce izrade sajta nisi u pravu, sa CSS-om ti samo namestas elemente i dajes im neke odredjene karakteristike, koje mogu biti jako fino odredjene i sa njim je moguce bas sve izvesti samo ti je potrebno iskustvo, u pocetku neces moci sve da znas kako se radi, ali sto vise radis sve ce ti biti lakse.

Samo ti kreni od basic stvari ka tezim i sve ce to tebi polako doci na svoje mesto.

misk0

11. 02. 2006. 21:46

Zero: vezano za browsere: htio sam cuti i druga misljenja osim tvog, NHF.

Drugo, nisam ja bas pocetnik sto se tiche CSS-a koristim ga, skontao sam neke fazone, ali sam izgubio vec poprilicno vremena, tj imao sam ga tad. Sutra kad ga ne budem imao, sta cu onda? ... o tome govorim.

zekica

11. 02. 2006. 22:59

Evo za ovaj footer mi je trebalo 2 minuta da napravim (uzeo sam malo tvog koda Bojane). Radi u Mozilla-i i KHTML-u (Safari), u ostalim bi trebalo da radi, ali nemam sad vremena da probam - imam pametnijih stvari.

Kôd:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<style>

html {

  height: 100%;

}

body {

  min-height: 100%;

  position: relative;

  margin: 0;

}

* html body {

  height: 100%;

}

#container {

  overflow: auto;

  padding-bottom: 1.2em;

}

#left {

  float:left;

  width:20%;

  border: 1px red solid;

}

#right {

  float:right;

  width:20%;

  border: 1px solid blue;

}

#content {

  margin: 0 20%;

  border: 1px solid blue;

}

#footer {

  position: absolute;

  left: 0;

  right: 0;

  bottom: 0;

  border: 1px solid green;

}

* html #footer {

  width: 100%;

}

</style>

<body>

<div id="container">

<div id="left">Leva kolona</div>

<div id="right">Desna kolona</div>

<div id="content">

Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>



Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>

Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>

Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>



Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>

Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>

Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>



Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>Sadrzaj<br>

</div>

</div>

<div id="footer">Footer</div>

</div>

</body>

</html>

Ima ukupno 2 haka potrebna da bi radilo u IE browserima...

bojan_bozovic

12. 02. 2006. 00:30

@zekica a isto je i za dragana

Da vidimo malo CSS

html {
height: 100%; ?!
}
body {
min-height: 100%; ?!
position: relative;
margin: 0;
}
* html body {
height: 100%; ?!
}

Dakle, zbog ovoga je to cisti hakeraj. Ako vec nisi video hack sansa da ga napravis je nula i to je problem, a ako radi copy/paste nismo ni resavali konkretan problem. ;) Jos kad vidim kako ima onih koji poistovecuju webdesign sa HTML (ne ovde, drugde) muka mi pripadne.

ivanhoe

12. 02. 2006. 02:30

eh, ti ga sad pretera...sve ovo mozes da provalis iz W3C specifikacije i citanja par knjiga i tutorijala na ovu temu i PAR MESECI VEZBANJA...ne moze preko noci da se predje na CSS, kao sto uostalom nisi ni mogao tabele tek tako da sednes da koristis u dizajnu, u vreme Netscape-a 4 i IE 3 tabele su bile nocna mora...jedan extra spejs na pogresnom mestu i sve se raspadne...

e pa bas kao sto je to tad zahtevalo vezbu i CSS sad zahteva malo probanja, i gnjavljenja i neprospavanih noci, ali kad naucis vrlo je korisna tehnologija... a kako browseri budu postajali kompatibilniji sve ce lakse biti raditi sa CSS-om, bas kao sto se danas tabele smatraju jednstavnom tehnikom ( a veruj mi na rec na 98 ili 99 nisu bile nimalo jednostavne...)

Inace jedini pravi hakeraj ovde je * html fora za height:100% za IE jer on ne podrzava min-height, a po defaultu prosiri kontejner ako ne moze da stane sadrzaj (takodje nepravilno), pa se to onda koristi da se simulira standardno ponasanje koje se postize sa min-height.. A i ovo min-height 100% je potrebno samo ako ti je sadrzaj na stranici manji od visine ekrana, a zelis da ti footer bude skroz dole, jer PO STANDARDU html i body su block elementi pa se zato prosire samo koliko ima sadrzaja u njima... prosto ko pasulj..;)

Vreme je GMT +2. Trenutno vreme je 04:25.

Strana 5 od 6

5

Prikažite 40 poruka iz ove teme na jednoj stani

Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.

Mišljenja, saveti, izjave, ponude ili druge informacije ili sadržaji nastali na Sajtu su vlasništvo onoga ko ih je kreirao, a ne DevProTalk.com, tako da ne morate da se oslanjate na njih.
Autori poruka su jedini odgovorni za ovakve sadržaje. DevProTalk.com ne garantuje tačnost, kompletnost ili upotrebnu vrednost informacija, stavova, saveta ili datih izjava. Ne postoje uslovi pod kojima bi mi bili odgovorni za štetu ili gubitak koji je posledica bilo čijeg oslanjanja na nepouzdane informacije, ili bilo kakve informacije nastale kroz komunikaciju između registrovanih članova.
Web sajt može sadržavati linkove na druge web sajtove na Internetu ili neke druge sadržaje. Ne kontrolišemo niti podržavamo te druge web sajtove, niti smo pregledali bilo kakve sadržaje na takvim sajtovima. Mi nećemo biti odgovorni za legalnost, tačnost ili prikladnost bilo kog sadržaja, oglasa, proizvoda, usluga ili informacije lociranim na ili distribuiranih kroz druge web sajtove, niti za bilo kakvu štetu nastalu kao posledica takvih informacija. DevProTalk.com drži i čuva druga prava vlasništva na web sajtu. Web sajt sadrže materijale zaštićene copyright-om, zaštitne znakove i druge informacije o pravu vlasništva ili softver. Članovi mogu poslatu informacije zaštićene pravima vlasništva njihovih nosilaca i ona ostaju zaštićena bez obzira da li su oni koji prenose te informacije to naveli ili ne. Osim informacija koje su u javnom vlasništvu ili za koje dobijete dozvolu, nemate pravo da kopirate, modifikujete ili na bilo koji način menjate, objavljujete, prenosite, distribuirate, izvršavate, prikazujete ili prodajte bilo koju informaciju zaštićenu pravima vlasništva. Slanjem informacija ili sadržaja na bilo koji deo DevProTalk.com, Vi automatski dozvoljavate i predstavljate garanciju da imate pravo da dozvolite DevProTalk.com ili članovima DevProTalk.com bespovratnu, kontinualnu, neograničenu, globalnu dozvolu da koriste, kopiraju, izvršavaju, prikazuju i distribuiraju takve informacije i sadržaje i da iz takvih sadžaja koriste bilo koji deo u bilo koje svrhe, kao i pravo i dozvolu da koriste gore navedene sadržaje. Svi zaštitni znakovi (trademarks), logotipi, oznake usluga, firme ili imena proizvoda koji se pominju na ovom web sajtu su vlasništvo kojim raspolažu njihovi vlasnici.