Nie jesteś zalogowany.
Jeśli nie posiadasz konta, zarejestruj je już teraz! Pozwoli Ci ono w pełni korzystać z naszego serwisu. Spamerom dziękujemy!

Ogłoszenie

Prosimy o pomoc dla małej Julki — przekaż 1% podatku na Fundacji Dzieciom zdazyć z Pomocą.
Więcej informacji na dug.net.pl/pomagamy/.

#1  2014-12-15 10:18:33

  HAL9000 - Użytkownik

HAL9000
Użytkownik
Zarejestrowany: 2006-04-22

Pozycjonowanie z wykorzystaniem 960gs

Witam
Znajomy "zlecił" mi zrobienie strony i z html i php jakoś sobie radzę ale pozycjonowanie elementów to dla mnie czarna magia i aby to uprościć chciałem wykorzystać 960gs -> http://960.gs/ i jak zwykle na obrazkach wszystko wygląda ładnie prosto itd ale gdy przyjdzie coś zrobić to zaczynają się schody.

Po pierwsze
idealne ustawienie elementów wygląda tak -> http://images.sixrevisions.com/2010/07/12-03_12columngrid.jpg
u mnie po ustawieniu obrazka z tłem aby mieć jakąś orientację jak to działa wygląda tak -> http://www.h9k.republika.pl/960gs.png
i nie wiem dlaczego tekst z lewej nie pokrywa sie z początkiem obrazka, który wydaje się przesunięty w prawo.

Następna sprawa puste przestrzenie realizowane za pomocą klas prefix_x i suffix_x na obrazku wygląda tak -> http://images.sixrevisions.com/2010/07/12-11_prefixsuffix.jpg
i dla jasności chciałem wyjaśnić te tła to są zrobione w jakimś programie graficznym bo gdy ja próbuję czegoś takiego to tło rozciąga się na całą "wolną przestrzeń" gdyż jak podejrzałem w pliku css te przesunięcia są realizowane przez padding-left i padding-right. Czy jedyny sposób aby osiągnąć efekt gdzie tylko tło konkretnego div'a jest żądanego kolory tak jak na tym moim obrazku w przypadku elementu "footer" to wstawianie jednego diva w inny gdzie ten zewnętrzny na przezroczyste tło w wewnętrzny na dodany jakiś id i ustawione wymagane tło?
cały kod na razie oczywiście tylko do eksperymentów wygląda tak:

Kod:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>gs2</title>
    <link rel="stylesheet" type="text/css" href="libs/960.css">
    <style type="text/css">
    div.grid_5, div.grid_4
    {
        background-color: #a1a1a1;
    }
    div#maincontainer
    {
        background: #ffffff url('images/960_grid_12_col.png') repeat-y left top;
    }
    div#pagefooter
    {
        background-color: #a1a1a1;
    }
    </style>
</head>
<body>

<div class="container_12" id="maincontainer">
<div class="grid_3">logo</div>

<div class="grid_6 prefix_3">menu</div>

<div class="grid_10 prefix_1 suffix_1">
    <div class="grid_5 alpha">article 1</div>
    <div class="grid_5 omega">article 2</div>
</div>

<div class="grid_3">above footer 1</div>
<div class="grid_3">above footer 2</div>
<div class="grid_3">above footer 3</div>
<div class="grid_3">above footer 4</div>
<div class="grid_6 prefix_3 suffix_3">
<div class="grid_6 alpha omega" id="pagefooter">footer</div>
</div>
</div>
</body>
</html>

For some reason I'm thinking I'm still 25 but I act like I'm 12.

Offline

 

#2  2014-12-15 12:57:31

  ethanak - Użytkownik

ethanak
Użytkownik
Skąd: Ungwenor
Zarejestrowany: 2010-07-19
Serwis

Re: Pozycjonowanie z wykorzystaniem 960gs

a możesz pokazać projekt graficzny? bo na mój emerytowany webmasterski rozum błąd jest w założeniach...


Nim mechaniczne larum zagrasz mi, kanalio,
głosząc nadejście Javy - śmiertelnego wroga!
[i]Zespół Adwokacki Dyskrecja[/i]

Offline

 

#3  2014-12-15 13:08:11

  HAL9000 - Użytkownik

HAL9000
Użytkownik
Zarejestrowany: 2006-04-22

Re: Pozycjonowanie z wykorzystaniem 960gs

Masz całkowitą rację co do punktu nr 1 nie sprawdziłem nawet jak wygląda ta grafika i się okazuje, że nie zaczyna się od lewej kolorem różowym ale białym (bo skopiowałem szablon z tego archiwum 960gs i tyle) to by się więc wyjaśniło pozostaje kwestia tych tzw pustych przestrzeni.


For some reason I'm thinking I'm still 25 but I act like I'm 12.

Offline

 

#4  2014-12-15 13:10:33

  ethanak - Użytkownik

ethanak
Użytkownik
Skąd: Ungwenor
Zarejestrowany: 2010-07-19
Serwis

Re: Pozycjonowanie z wykorzystaniem 960gs

ponawiam prośbę...


Nim mechaniczne larum zagrasz mi, kanalio,
głosząc nadejście Javy - śmiertelnego wroga!
[i]Zespół Adwokacki Dyskrecja[/i]

Offline

 

#5  2014-12-15 13:29:26

  HAL9000 - Użytkownik

HAL9000
Użytkownik
Zarejestrowany: 2006-04-22

Re: Pozycjonowanie z wykorzystaniem 960gs

Oryginalna grafika wyglada tak -> http://www.h9k.republika.pl/960_grid_12_col.png
natomiast po edycji w niesamowicie zaawansowanym programie graficznym paint wyglad tak -> http://www.h9k.republika.pl/960_grid_12_col_1.png
zostawilem bialy obszar na wymagane marginesy 10px po lewej i prawej i efekt wyglada tak -> http://www.h9k.republika.pl/960gs_1.png


For some reason I'm thinking I'm still 25 but I act like I'm 12.

Offline

 

#6  2014-12-15 13:42:53

  ethanak - Użytkownik

ethanak
Użytkownik
Skąd: Ungwenor
Zarejestrowany: 2010-07-19
Serwis

Re: Pozycjonowanie z wykorzystaniem 960gs

zadałem ci konkretne pytanie. jeśli dalej chcesz lecieć w ciula - twoja sprawa, ale pomocy szukaj w dokumentacji do tego wynalazku albo na onecie.
masz jeszcze jedną szansę...


Nim mechaniczne larum zagrasz mi, kanalio,
głosząc nadejście Javy - śmiertelnego wroga!
[i]Zespół Adwokacki Dyskrecja[/i]

Offline

 

#7  2014-12-15 23:15:20

  HAL9000 - Użytkownik

HAL9000
Użytkownik
Zarejestrowany: 2006-04-22

Re: Pozycjonowanie z wykorzystaniem 960gs

Chyba się nie zrozumieliśmy bo "nie lecę w ciula" ale po prostu nie wiem o co Tobie w tym momencie chodzi projekt graficzny czego?


For some reason I'm thinking I'm still 25 but I act like I'm 12.

Offline

 

#8  2014-12-16 12:57:54

  ethanak - Użytkownik

ethanak
Użytkownik
Skąd: Ungwenor
Zarejestrowany: 2010-07-19
Serwis

Re: Pozycjonowanie z wykorzystaniem 960gs

Znajomy "zlecił" mi zrobienie strony[/quote]
Nie powiesz mi że robisz to bez projektu?
Przy czym nie chodzi mi tu o smętne dywagacje na temat prostokącików na pasiaku.


Nim mechaniczne larum zagrasz mi, kanalio,
głosząc nadejście Javy - śmiertelnego wroga!
[i]Zespół Adwokacki Dyskrecja[/i]

Offline

 

#9  2014-12-16 13:03:28

  pink - Użytkownik

pink
Użytkownik
Skąd: P17PY93
Zarejestrowany: 2005-09-16
Serwis

Re: Pozycjonowanie z wykorzystaniem 960gs

http://www.responsivegridsystem.com/


T430 think-box 4.9-custom x86_64 Intel(R) Core(TM) i5-3230M CPU @ 2.60GHz GenuineIntel GNU/Linux
"Doktor plama i maharadża są pod złotym leszczem." "Człowieka od zwierzęcia odróżnia ciekawość świata. Patrze słucham i wyciągam wnioski."
http://przemyslawmamon.com/
https://www.behance.net/przemyslawmamon

Offline

 

#10  2014-12-17 07:52:58

  HAL9000 - Użytkownik

HAL9000
Użytkownik
Zarejestrowany: 2006-04-22

Re: Pozycjonowanie z wykorzystaniem 960gs

[quote=ethanak]Nie powiesz mi że robisz to bez projektu?
Przy czym nie chodzi mi tu o smętne dywagacje na temat prostokącików na pasiaku.[/quote]
Ano bez a te paski to sa tylko po to abym mógł się zorientować jak ten cały system siatkowy z tego szablonu działa bo jak widać treści tam nie ma żadnej a ja nie lubię robić x razy tego samego więc na początek chciałem mieć przynajmniej minimalne zrozumienie tego 960gs is tyle.


For some reason I'm thinking I'm still 25 but I act like I'm 12.

Offline

 

Stopka forum

Powered by PunBB
© Copyright 2002–2005 Rickard Andersson
To nie jest tylko forum, to nasza mała ojczyzna ;-)

[ Generated in 0.008 seconds, 10 queries executed ]

Informacje debugowania

Time (s) Query
0.00012 SET CHARSET latin2
0.00007 SET NAMES latin2
0.00122 SELECT u.*, g.*, o.logged FROM punbb_users AS u INNER JOIN punbb_groups AS g ON u.group_id=g.g_id LEFT JOIN punbb_online AS o ON o.ident='18.217.246.148' WHERE u.id=1
0.00068 REPLACE INTO punbb_online (user_id, ident, logged) VALUES(1, '18.217.246.148', 1732443447)
0.00042 SELECT * FROM punbb_online WHERE logged<1732443147
0.00062 DELETE FROM punbb_online WHERE ident='18.224.69.176'
0.00050 SELECT t.subject, t.closed, t.num_replies, t.sticky, f.id AS forum_id, f.forum_name, f.moderators, fp.post_replies, 0 FROM punbb_topics AS t INNER JOIN punbb_forums AS f ON f.id=t.forum_id LEFT JOIN punbb_forum_perms AS fp ON (fp.forum_id=f.id AND fp.group_id=3) WHERE (fp.read_forum IS NULL OR fp.read_forum=1) AND t.id=26798 AND t.moved_to IS NULL
0.00006 SELECT search_for, replace_with FROM punbb_censoring
0.00150 SELECT u.email, u.title, u.url, u.location, u.use_avatar, u.signature, u.email_setting, u.num_posts, u.registered, u.admin_note, p.id, p.poster AS username, p.poster_id, p.poster_ip, p.poster_email, p.message, p.hide_smilies, p.posted, p.edited, p.edited_by, g.g_id, g.g_user_title, o.user_id AS is_online FROM punbb_posts AS p INNER JOIN punbb_users AS u ON u.id=p.poster_id INNER JOIN punbb_groups AS g ON g.g_id=u.group_id LEFT JOIN punbb_online AS o ON (o.user_id=u.id AND o.user_id!=1 AND o.idle=0) WHERE p.topic_id=26798 ORDER BY p.id LIMIT 0,25
0.00072 UPDATE punbb_topics SET num_views=num_views+1 WHERE id=26798
Total query time: 0.00591 s