Jump to content
aga_kc

[css] przykład strony 3-kolumnowej przy zastosowaniu DIVów

Recommended Posts

tutka tego opublikowałam najpierw na grafart.az.pl ale Saddam poprosił mnie abym go również tutaj przykleiła :) A więc proszę:

 

Cssowy tutorial dla tych co chcą zrobić stronkę na DIVach :)

 

Wydaje mi się, że dla co niektórych nie jest to zrozumiałe a nawet rodzi się strach w oczach więc zaczniemy od początku, żeby było janso :)

 

Strona Trójkolumnowa

 

Krok 1

Na początku zajmiemy się tylko kodem właściwym, styl DIVom nadamy później ;)

 

Tworzymy sobie cały standardowy (początkowy) kod jak do kazdej strony

 

 

<html>
<head>

</head>

<body>

</body>
<html>

 

Krok 2

Następnie w <body> musiamy sobie utworzyć DIVy , nadać im nazwy

 

Krok 2 a

DIV główny (w naszym przypadku "container" - tak się przyjęło, że ten DIV najczęściej właśnie jest tak nazywany, ale można nadać mu nazwe według własnego uznania) musi być zamknięty na samym dole, najlepiej zrobic to od razu automatycznie , bo inaczej powychodzą nam później różne dziwne "kszaczki". Jest to DIV w którym zawierać się będą pozostałe DIVy z grafiką , tekstem i co tam jeszcze chcecie. ;)

 

<html>
<head>

</head>

<body>
<div id="container">


</div>	
</body>
<html>

 

Krok 3

Skoro będzie to strona 3-kolumnowawa to w DIVie głównym (nasz "container") utworzyć musimy następujące DIVy

 

<html>
<head>

</head>

<body>
<div id="container">

<div id="naglowek"> </div>

<div id="lewo"> </div>

<div id="srodek"> </div>

<div id="prawo"> </div>

<div id="stopka"> </div>


</div>	
</body>
<html>

 

Najlepiej od razu pozamykać każdego DIVa, żeby później można było już do niego wklepać zawartość.

 

 

Krok 4

Wklepny teraz jakąś treść do DIVów "lewo", "prawo", "srodek" oraz "stopka"

"stoka" jest tutaj niezwykle ważna, bo okazuje się, że bez niej niektóre style w innym divach po prostu nie chcą działać albo działają źle.

 

 

<html>
<head>

</head>

<body>
<div id="container">

<div id="naglowek"> </div>

<div id="lewo"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum.</div>

<div id="srodek"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum. Nam egestas pede gravida diam. Ut sagittis dolor in tortor. Mauris euismod dictum massa. Nulla facilisi. Mauris magna.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum. Nam egestas pede gravida diam. Ut sagittis dolor in tortor. Mauris euismod dictum massa. Nulla facilisi. Mauris magna.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, </div>

<div id="prawo">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum. </div>

<div id="stopka"> Created by Jan Kowalski</div>


</div>	
</body>
<html>

 

Krok 5

Mając juz tekst w divach przechodzimy do przypisywania dla nich stylów w css.

Styl CSS oczywiscie jak wiecie zamieszcza się w headzie. (Już nie będę powtarzała całego kodu, zapisze tylko sam CSS)

 

<head>

<style type="text/css">

body {
	background-color: #000;
	margin: 0;
	padding: 0;
	text-align:center;
}

div {
	font: verdana 12px #000;
	position:relative;
}

#container {
	margin:0 auto;
	padding:0 5px 0 5px;
	position:relative;
	width:700px;
	background-color:#fff;
	text-align:left;
	clear: both;
}

#naglowek {
	background: #fff url(logo.jpg) no-repeat;
	width:700px;
	height:150px;
	margin-bottom:10px;
}

#lewo {
	width:150px;
	float:left;
}

#prawo {
	width:150px;
	float:right;
}

#srodek {
	width:400px;
	float:left;
}

#stopka {
	clear:both;
	text-align:center;
}

</style>
</head>

 

Komentarze do CSS:

a. margin: 0;

padding: 0;

text-align:center;

Ten fragment w body jest bardzo istotny, poniewaz to dzieki niemu strona jest wyśrodkowana w całości

 

b. position:relative;

Position relative nie zawsze musi byc stosowany, w naszym przypaku przydał się, możecie nim ustanowić "miejsce" na stronie każdemu elementowi do tego uzywa się również: top bottom left right , którym po przypisaniu odpowiednich wartości liczbowych (wzór: 12px) nadajemy odległość od danego brzegu strony

 

c. float:left; float:right;

Służa do tego, żeby divy do siebie przylegały lub też były w jednej linii.

 

 

Końcowy efekt wygląda tak:

Hidden Content

    Give reaction or reply to this topic to see the hidden content.

 

 

Mam nadzieje, że wydaje się to zrozumiałe, na tym przykładzie możecie poeksperymentować z innym wartościami innym układem, to już zalezy od was.

 

Jeszcze mała uwaga, chyba Netch się pytał o krojenie etc: otórzy najlepiej jest sobie najpierw w programie graficznym stworzyć jakąś część graqficzną do strony, pociąć, nadać nazwy i następnie w cssie / w divom nadawać albo background-image albo wpisywać <img src="#"> (to zależy od układu i koncepcji strony). Przy obrazkach w danym divie, nalezy pamietać , że div powienien mieć przypisane wielkości (width i height) takie jak obrazek , który ma byc w jego tle.

O tym więcej - później ;)

  • Like 1

Share this post


Link to post
Share on other sites

Hidden Content

    Give reaction or reply to this topic to see the hidden content.

a apropos clear:both to jest to deklaracja która przeniesie diva do nowej linijki stosowana w przypadku użycia float

Share this post


Link to post
Share on other sites

No i goood! Osobiście nie znałem i nieużywałem nigdy divów, napewno od teraz zaczneich używać


Crystal Templates - [+][+][+][+][-][-][-][-][-][-] 40%

Share this post


Link to post
Share on other sites

hmm Worms ja też tego kiedyś intensywnie szukałem o wiedziałem ze takie cos jest na forum i jakieś dwa tygodnie temu znalazłem,

Hidden Content

    Give reaction or reply to this topic to see the hidden content.
ale dopiero dzisiaj sie tym zają…łem i dziekuję Ci Aga jeszcze raz ze to opublikowałaś tutaj..

Share this post


Link to post
Share on other sites

Na pewno się przyda! Szczególnie tym którzy jeszcze nie wykonali prac kwalifikacyjnych do grupy XHTML+CSS :D Szkoda że nie umieściłaś tego dzień wcześniej :D

Share this post


Link to post
Share on other sites

Nie czepiam sie, bo tutorial naprawde super. Ale w stylu nie powinno zamiast

 

#head {

	}

 

byc

 

#naglowek {

	}

 

Pozdrawiam, jesli sie myle, poprawcie mnie nie jestem jeszcze dobry w tych tematach :)

Share this post


Link to post
Share on other sites

nie. bo tu chodzi o nadanie koloru tła całej stronie itp. można zamiast tego wpisać body też będzie ok, a nie nagłówek. o ile dobrze zrozumialem twoje pytanie. jak cos zle mysle to mnie poprawcie.


"Quod me nutrit me destruit" - Christopher Marlowe

Share this post


Link to post
Share on other sites

Tutorial bardzo mnie sie podoba ale cos nie moge wejsc na ta stronke

Hidden Content

    Give reaction or reply to this topic to see the hidden content.


/\

Noob: Co to jest za kreska kto ja w ogole tutaj zrobil?

Uzytkownik webtips.pl: To moderatorzy ja tu wstawili

Noob: Aha fajna kreska naprawde fajna kreska.

 

 

Szybki upload zdjec!

Share this post


Link to post
Share on other sites

nie. bo tu chodzi o nadanie koloru tła całej stronie itp. można zamiast tego wpisać body też będzie ok, a nie nagłówek. o ile dobrze zrozumialem twoje pytanie. jak cos zle mysle to mnie poprawcie.

 

Nie zrozumielismy sie ;)

 

chodzi mi o to, ze w pliku .html mamy takiego oto div'a:

 <div id="naglowek"> </div> 

 

a w stylu mamy:

 

 #head {
	background: #fff url(logo.jpg) no-repeat;
	width:700px;
	height:150px;
	margin-bottom:10px;
}

 

A wiec moim zdaniem autor poprostu walnal pomylke i nadal

div id="naglowek"

angielski odpowiednik jesli chodzi o sam wyraz "naglowek" = "head" ;]

 

Jesli sie myle, to sorry, nie wiem jak inaczej zinterpretowac ta sprawe ;]

 

Pozdro

 

-- Poprawione !!

Saddam92

Share this post


Link to post
Share on other sites

hmmm

a ja mam pytanko.

mam taki kod:

<html>
<head>
<title>lay</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<style type="text/css">


div.Table_01 {
position:absolute;
left:0px;
top:0px;
width:1024px;
height:768px;
}

div.lay-01 {
position:absolute;
left:0px;
top:0px;
width:32px;
height:154px;
}

div.lay-02 {
position:absolute;
left:32px;
top:0px;
width:954px;
height:117px;
}

div.lay-03 {
position:absolute;
left:986px;
top:0px;
width:38px;
height:768px;
}

div.lay-04 {
position:absolute;
left:32px;
top:117px;
width:1px;
height:37px;
}

div.lay-05 {
position:absolute;
left:33px;
top:117px;
width:133px;
height:37px;
}

div.lay-06 {
position:absolute;
left:166px;
top:117px;
width:12px;
height:651px;
}

div.lay-07 {
position:absolute;
left:178px;
top:117px;
width:794px;
height:627px;
}

div.lay-08 {
position:absolute;
left:972px;
top:117px;
width:14px;
height:651px;
}

div.lay-09 {
position:absolute;
left:0px;
top:154px;
width:31px;
height:36px;
}

div.lay-10 {
position:absolute;
left:31px;
top:154px;
width:135px;
height:36px;
}

div.lay-11 {
position:absolute;
left:0px;
top:190px;
width:30px;
height:578px;
}

div.lay-12 {
position:absolute;
left:30px;
top:190px;
width:136px;
height:68px;
}

div.lay-13 {
position:absolute;
left:30px;
top:258px;
width:136px;
height:52px;
}

div.lay-14 {
position:absolute;
left:30px;
top:310px;
width:1px;
height:458px;
}

div.lay-15 {
position:absolute;
left:31px;
top:310px;
width:135px;
height:434px;
}

div.lay-16 {
position:absolute;
left:31px;
top:744px;
width:135px;
height:24px;
}

div.lay-17 {
position:absolute;
left:178px;
top:744px;
width:794px;
height:11px;
}

div.lay-18 {
position:absolute;
left:178px;
top:755px;
width:794px;
height:13px;
}

-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<!-- ImageReady Slices (lay.psd) -->
<div class="Table_01">
<div class="lay-01">
	<img src="images/lay_01.png" width="32" height="154" alt="">
</div>
<div class="lay-02">
	<img src="images/lay_02.png" width="954" height="117" alt="">
</div>
<div class="lay-03">
	<img src="images/lay_03.png" width="38" height="768" alt="">
</div>
<div class="lay-04">
	<img src="images/lay_04.png" width="1" height="37" alt="">
</div>
<div class="lay-05">
	<img src="images/lay_05.png" width="133" height="37" alt="">
</div>
<div class="lay-06">
	<img src="images/lay_06.png" width="12" height="651" alt="">
</div>
<div class="lay-07">
	<img src="images/lay_07.png" width="794" height="627" alt="">
</div>
<div class="lay-08">
	<img src="images/lay_08.png" width="14" height="651" alt="">
</div>
<div class="lay-09">
	<img src="images/lay_09.png" width="31" height="36" alt="">
</div>
<div class="lay-10">
	<img src="images/lay_10.png" width="135" height="36" alt="">
</div>
<div class="lay-11">
	<img src="images/lay_11.png" width="30" height="578" alt="">
</div>
<div class="lay-12">
	<img src="images/lay_12.png" width="136" height="68" alt="">
</div>
<div class="lay-13">
	<img src="images/lay_13.png" width="136" height="52" alt="">
</div>
<div class="lay-14">
	<img src="images/lay_14.png" width="1" height="458" alt="">
</div>
<div class="lay-15">
	<img src="images/lay_15.png" width="135" height="434" alt="">
</div>
<div class="lay-16">
	<img src="images/lay_16.png" width="135" height="24" alt="">
</div>
<div class="lay-17">
	<img src="images/lay_17.png" width="794" height="11" alt="">
</div>
<div class="lay-18">
	<img src="images/lay_18.png" width="794" height="13" alt="">
</div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>

wygenerowany przez IR bo tam lay robiłem..

Otoz jak to przelozyc na taka stronke moze nie trzy kolumnowa ale jak?

 

-- nastepnym razem taki kod pisz w [ codebox ]

Saddam92

Share this post


Link to post
Share on other sites

Bardzo fajny tutorialdopiero ucze sie css!macie moze jeszcze jakies stronki gdzie sa wytlumaczone takie rzeczy krok po kroku??Bardzo by mi sie przylady jak tworzyc takie stronki:)

Share this post


Link to post
Share on other sites

Nie wiem czy zauważyliście, ale takie rozwią…zanie wyglą…da dobrze tylko w przeglą…darkach, które poprawnie interpretują… CSS czyli nie w Internet Explorerze

Jak odpalam powyższy kod w FireFoxie jest OK, ale jak przełą…czę na IE to niestety div - prawy lą…duje poniżej srodka i lewego Czy ktoś ma podobnie??

Na razie jeszcze nie mam czasu, ale postaram się zrobić to jak trzeba

W takich przypadkach stosuje się tzw hacki na IE po to żeby strona wyglą…dała dobrze na każdej przeglą…darce Będę miał chwilę to wkleję właściwy kod.

 

Przy okazji witam wszystkich bo to 1. mój post na tym forum. Bardzo mi się ono podoba. Wyróżnia się spośród wielu innych fachowością… wypowiedzi a o to mi chodzi jak szukam rozwią…zania jakiegoś tematu

Pozdrawiam wszystkich !!

FireBoy

 

[dodano po chwili]

Proponuję takie rozwią…zanie:

#container {
	margin:0 auto;
	padding:0 5px 0 5px;
	position:relative;
	width: 700px !important;
	width: 710px; /* IE */
	background-color:#fff;
	text-align:left;
	clear: both;
}

aga_kc w Twoim rozwią…zaniu IE widzi div'a container jakby miał szerokość 690px, a to z uwagi na to, że dodałaś padding: 0 5px 0 5px; (tak nawiasem mówią…c można to zrobić padding: 0 5px; - powinien być ten sam efekt). Trzeba więc zastosować hack'a który ustali dla IE o 10 px większy div :) Przesunięcie ostatniej kolumny na dół było spowodowane tym, że "nie mieściła się w div'ie.

Przykładowo jeśli chcielibyśmy to trochę zrobić ładniej i sprawić, żeby test w div'ach był oddalony od ich krawędzi, przez co chyba bardziej czytelny robimy dokładnie to samo

#lewo {
padding:0 5px;
width: 140px !important;
width: 150px;
float:left;
}

#prawo {
padding:0 5px;
width: 140px !important;
width: 150px;
float:right;
}

#srodek {
padding:0 5px;
width: 390px !important;
width: 400px;
float:left;
}

Wydaje mi się, że tak jest czytelniej.

Proponuję przy korzystaniu z div'ów nadawać każdemu z nich nadać tymczasowo parametr background-color przypisują…c każdemu z nich inny kolor, co ułatwi ich rozmieszczanie. Czasem zdarza się, że występują… przerwy pomiędzy div'ami których przy jednolitym tle nie widać. Po prawidłowym rozmieszczeniu i zadowalają…cym wyglą…dzie ustalamy taki kolor jaki ma być pożą…dany

 

Pozdrawiam

FireBoy

Share this post


Link to post
Share on other sites
do wywalenia

 

<_<

 

Przykład - Page not Found

 

Matko, ale z Was są… Wiemy, że przykład 'znikną…ł', ale czy taki problem, samemu napisać kod i zobaczyć jak działa?


Crystal Templates - [+][+][+][+][-][-][-][-][-][-] 40%

Share this post


Link to post
Share on other sites

Nie wiem czy zauważyliście, ale takie rozwią…zanie wyglą…da dobrze tylko w przeglą…darkach, które poprawnie interpretują… CSS czyli nie w Internet Explorerze

Jak odpalam powyższy kod w FireFoxie jest OK, ale jak przełą…czę na IE to niestety div - prawy lą…duje poniżej srodka i lewego Czy ktoś ma podobnie??

Na razie jeszcze nie mam czasu, ale postaram się zrobić to jak trzeba

W takich przypadkach stosuje się tzw hacki na IE po to żeby strona wyglą…dała dobrze na każdej przeglą…darce Będę miał chwilę to wkleję właściwy kod.

 

Przy okazji witam wszystkich bo to 1. mój post na tym forum. Bardzo mi się ono podoba. Wyróżnia się spośród wielu innych fachowością… wypowiedzi a o to mi chodzi jak szukam rozwią…zania jakiegoś tematu

Pozdrawiam wszystkich !!

FireBoy

 

[dodano po chwili]

Proponuję takie rozwią…zanie:

#container {
	margin:0 auto;
	padding:0 5px 0 5px;
	position:relative;
	width: 700px !important;
	width: 710px; /* IE */
	background-color:#fff;
	text-align:left;
	clear: both;
}

aga_kc w Twoim rozwią…zaniu IE widzi div'a container jakby miał szerokość 690px, a to z uwagi na to, że dodałaś padding: 0 5px 0 5px; (tak nawiasem mówią…c można to zrobić padding: 0 5px; - powinien być ten sam efekt). Trzeba więc zastosować hack'a który ustali dla IE o 10 px większy div :) Przesunięcie ostatniej kolumny na dół było spowodowane tym, że "nie mieściła się w div'ie.

Przykładowo jeśli chcielibyśmy to trochę zrobić ładniej i sprawić, żeby test w div'ach był oddalony od ich krawędzi, przez co chyba bardziej czytelny robimy dokładnie to samo

#lewo {
padding:0 5px;
width: 140px !important;
width: 150px;
float:left;
}

#prawo {
padding:0 5px;
width: 140px !important;
width: 150px;
float:right;
}

#srodek {
padding:0 5px;
width: 390px !important;
width: 400px;
float:left;
}

Wydaje mi się, że tak jest czytelniej.

Proponuję przy korzystaniu z div'ów nadawać każdemu z nich nadać tymczasowo parametr background-color przypisują…c każdemu z nich inny kolor, co ułatwi ich rozmieszczanie. Czasem zdarza się, że występują… przerwy pomiędzy div'ami których przy jednolitym tle nie widać. Po prawidłowym rozmieszczeniu i zadowalają…cym wyglą…dzie ustalamy taki kolor jaki ma być pożą…dany

 

Pozdrawiam

FireBoy

 

Jeśli sie zrobi tak jak ty to napisałes to strona w IE nie jest wyśrodkowana :( POMOCY

 

 

Oto mój kod:

 

HTML:

<HTML>
<HEAD>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=iso-8859-2">
<META NAME="Description" CONTENT="Opis dokumentu">
<META NAME="Author" CONTENT="Autor dokumentu">
<TITLE>Tytuł</TITLE>
<LINK REL="stylesheet" HREF="style.css" TYPE="text/css" />
</HEAD>
<BODY>

<div id="container">

<div id="naglowek"> </div>

<div id="lewo"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum.</div>

<div id="srodek"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum. Nam egestas pede gravida diam. Ut sagittis dolor in tortor. Mauris euismod dictum massa. Nulla facilisi. Mauris magna.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum. Nam egestas pede gravida diam. Ut sagittis dolor in tortor. Mauris euismod dictum massa. Nulla facilisi. Mauris magna.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, </div>

<div id="prawo">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce nec velit id lacus pharetra interdum. In massa tellus, ultrices ac, luctus sit amet, nonummy sit amet, velit. In posuere. Aenean molestie purus vel massa. Vestibulum risus tellus, tempus ac, consequat et, mattis in, lectus. Vivamus malesuada hendrerit ipsum. Nam at dui eu lectus sollicitudin elementum. </div>

<div id="stopka"> Created by Jan Kowalski</div>


</div>	

</BODY>
</HTML>

 

I CSS:

<style type="text/css">

body {
	background-color: #000;
	margin: 0;
	padding: 0;
	text-align:center;
}

div {
	font: verdana 12px #000;
	position:relative;
}

#container {
	margin:0 auto;
	padding:0 5px 0 5px;
	position:relative;
	width: 700px !important;
	width: 710px; /* IE */
	background-color:#fff;
	text-align:left;
	clear: both;
}

#naglowek {
	background: #fff url(logo.jpg) no-repeat;
	width:700px;
	height:150px;
	margin-bottom:10px;
}

#lewo {
padding:0 5px;
width: 140px !important;
width: 150px;
float:left;
}

#prawo {
padding:0 5px;
width: 140px !important;
width: 150px;
float:right;
}

#srodek {
padding:0 5px;
width: 390px !important;
width: 400px;
float:left;
}

#stopka {
	clear:both;
	text-align:center;
}

</style>


neosygna.gif

admin.gif

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...