-
1. Data: 2011-10-15 22:16:08
Temat: DIV i CSS
Od: "Maco" <maco@doesnt_exist.pl>
Witam,
Szkielet strony postanowiłem zrobić na DIVach + CSS.
Naczytałem się w Googlach tutoriali i różynych innych przykładów i ciągle
nie potrafię poradzić sobie z zapewne prostym układem.
Podpowiedzcie proszę, bo zaczynam wątpić w to, czy ptrzesiadka na DIVy (z
tabel) to dobry pomysł :(((
Chcę zbudować stronę podzieloną na dwa wiersze: nagłówek i reszta strony (do
końca w dół), z których każdy podzielony jest na dwie kolumny.
(budowa strony - dla właściwego efektu czcionka Courier)
+----+-----------------+
| A | B |
+----+--+--------------+
| | |
| | |
| | |
| C | D |
| | |
| | |
+-------+--------------+
Rozmiary pól:
- A (width: 50px, height: 30px)
- B (width: do końca wiersza/okna w prawo, height: 30px)
- C (width: 150px; height: do końca strony w dół)
- D (width: do końca wiersza/okna w prawo, height: do końca strony w dół)
Treść pliku CSS i HTML:
body {
height : 100%
width : 100%;
margin: 0;
}
#strona {
height : 100%
width : 100%;
background-color : silver;
}
#naglowek {
width : 100%
}
#naglowek1 {
width:50px;
height : 30px;
float:left;
background-color : blue;
}
#naglowek2 {
width: 100%;
height : 30px;
background-color : navy;
}
#tresc {
height : 100%
width : 100%;
}
#kolumna1 {
width : 150px;
height: 100%;
float: left;
background-color : red;
}
#kolumna2 {
height: 100%;
background-color : yellow;
}
----
<div id="strona">
<div id="naglowek">
<div id="naglowek1">H1</div>
<div id="naglowek2">H2</div>
</div>
<div id="tresc">
<div id="kolumna1">K1</div>
<div id="kolumna2">K2</div>
</div>
</div>
Z wszelką pomoc i konstruktywne sugestie bardzo dziekuję.
Maco
-
2. Data: 2011-10-16 11:07:58
Temat: Re: DIV i CSS
Od: olo <o...@n...com>
W dniu 16.10.2011 00:16, Maco pisze:
> Z wszelką pomoc i konstruktywne sugestie bardzo dziekuję.
myślę, że to powinno pomóc
http://www.code-sucks.com/css%20layouts/faux-css-lay
outs/
--
pozdrawiam!
http://webtrunki.pl - piwa, wina, wódki, domowe wyroby
http://en.webtrunki.pl - beers, wines, vodkas, your own products
-
3. Data: 2011-10-16 14:13:24
Temat: Re: DIV i CSS
Od: "identifikator: 20110701" <N...@g...pl>
nie oszukuj się, nikt Ci tu nie pomoże, może nawet mimo tego, że wiedzą
jak... ja wystawiłem aukcję na zleceniach.przez.net, goście drogo nie
wzieli, ale otrzymałem elegancki kodzik który idealnie działa... też Ci
polecam...
mi pomógł "float: left" polecam dodanie go do kodu i sprawdzenie jak działa
-
4. Data: 2011-10-16 16:33:37
Temat: Re: DIV i CSS
Od: Wojtek Gapiński <w...@w...I.TO.TEZ.pl>
Dnia 16-10-2011 16:13 identifikator: 20110701 napisał:
> nie oszukuj się, nikt Ci tu nie pomoże, może nawet mimo tego, że wiedzą
Zapomniałeś dodać, że tych, co starali się Ci pomóc i podpowiedzieć
rozwiązanie, zmieszałeś z błotem i wyzwałeś od różnych. I to nie raz.
Dlatego nie oczekuj, że ktoś jeszcze będzie chciał Ci tu pomagać.
> jak... ja wystawiłem aukcję na zleceniach.przez.net, goście drogo nie
> wzieli, ale otrzymałem elegancki kodzik który idealnie działa... też Ci
> polecam...
>
Jasne, i podobnie jak tu nikt nie wziął za to grosza?
--
Wojtek Gapiński
http://jwmprojekt.pl
-
5. Data: 2011-10-16 19:55:18
Temat: Re: DIV i CSS
Od: Mirosław Zalewski <miniopl@CUT_THIS.gmail.com>
niedziela, 16 października 2011 18:33 wielka mądrość na czytelników
pl.comp.www spłynęła, gdy tako rzekł(a) Wojtek Gapiński:
>> jak... ja wystawiłem aukcję na zleceniach.przez.net, goście drogo nie
^^^^^^^^^
>> wzieli, ale otrzymałem elegancki kodzik który idealnie działa... też Ci
^^^^^^
>> polecam...
>>
>
> Jasne, i podobnie jak tu nikt nie wziął za to grosza?
Podkreśliłem istotny fragment.
Swoją drogą uważam, że grupy dyskusyjne to nie jest darmowy heldpesk. Co
innego problemy nietypowe czy dyskusja na temat ,,koszerności" pewnych
rozwiązań, a co innego pytanie o zagadnienia, których rozwiązanie można
znaleźć przy pomocy wyszukiwarki internetowej w ciągu dwóch minut.
--
Niżej podpisany, zamieszkały w http://minio.xt.pl ,
Mirosław Zalewski
-
6. Data: 2011-10-17 07:19:53
Temat: Re: DIV i CSS
Od: satellite <p...@g...pl>
On 2011-10-16 00:16, Maco wrote:
a zobacz w przyblizeniu cos takiego :
> <div id="strona">
>
> <div id="naglowek" style="display: table">
> <div id="naglowek1" style="display: table-cell">H1</div>
> <div id="naglowek2" style="display: table-cell">H2</div>
> </div>
>
> <div id="tresc" style="display: table">
> <div id="kolumna1" style="display: table-cell">K1</div>
> <div id="kolumna2" style="display: table-cell">K2</div>
> </div>
>
> </div>
-
7. Data: 2011-10-18 11:22:41
Temat: Re: DIV i CSS
Od: "Maco" <maco@no_exists.pl>
Dzięki. To mnie naprowadziło.
Pozdrawiam,
Maco
Użytkownik "satellite" <p...@g...pl> napisał w wiadomości
news:j7gkum$7hf$1@inews.gazeta.pl...
> On 2011-10-16 00:16, Maco wrote:
>
>
> a zobacz w przyblizeniu cos takiego :
>
>> <div id="strona">
>>
>> <div id="naglowek" style="display: table">
>> <div id="naglowek1" style="display: table-cell">H1</div>
>> <div id="naglowek2" style="display: table-cell">H2</div>
>> </div>
>>
>> <div id="tresc" style="display: table">
>> <div id="kolumna1" style="display: table-cell">K1</div>
>> <div id="kolumna2" style="display: table-cell">K2</div>
>> </div>
>>
>> </div>
>
>