How can I fully control a rotation
How can I fully control the rotation of a div using CSS?
I've been struggling with this for a while now, but nothing seems to work properly. I'm using this for a document that needs to be as concise as possible and every time that I need to rotate a div inside a table cell, the width of that cell becomes uncontrollable, linked to the length of the word written inside.
Right now I'm using the code below, even though I've been trying to use other methods.
My aim is to reduce the width of the left cell and make it more suited to the font, freeing space.
My CSS:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
}
And my HTML:
<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">C</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>javascript html css html-table center
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
asked Nov 19 '18 at 15:01
L.BBL.BB
132
add a comment |
How can I fully control the rotation of a div using CSS?
I've been struggling with this for a while now, but nothing seems to work properly. I'm using this for a document that needs to be as concise as possible and every time that I need to rotate a div inside a table cell, the width of that cell becomes uncontrollable, linked to the length of the word written inside.
Right now I'm using the code below, even though I've been trying to use other methods.
My aim is to reduce the width of the left cell and make it more suited to the font, freeing space.
My CSS:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
}
And my HTML:
<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">C</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>javascript html css html-table center
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
asked Nov 19 '18 at 15:01
L.BBL.BB
132
add a comment |
How can I fully control the rotation of a div using CSS?
I've been struggling with this for a while now, but nothing seems to work properly. I'm using this for a document that needs to be as concise as possible and every time that I need to rotate a div inside a table cell, the width of that cell becomes uncontrollable, linked to the length of the word written inside.
Right now I'm using the code below, even though I've been trying to use other methods.
My aim is to reduce the width of the left cell and make it more suited to the font, freeing space.
My CSS:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
}
And my HTML:
<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">C</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>javascript html css html-table center
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
asked Nov 19 '18 at 15:01
L.BBL.BB
132
How can I fully control the rotation of a div using CSS?
I've been struggling with this for a while now, but nothing seems to work properly. I'm using this for a document that needs to be as concise as possible and every time that I need to rotate a div inside a table cell, the width of that cell becomes uncontrollable, linked to the length of the word written inside.
Right now I'm using the code below, even though I've been trying to use other methods.
My aim is to reduce the width of the left cell and make it more suited to the font, freeing space.
My CSS:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
}
And my HTML:
<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">C</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table><table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">C</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table><table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">C</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>javascript html css html-table center
javascript html css html-table center
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
asked Nov 19 '18 at 15:01
L.BBL.BB
132
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
asked Nov 19 '18 at 15:01
L.BBL.BB
132
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
edited Nov 19 '18 at 16:30
Brian Tompsett - 汤莱恩
4,2231338101
4,2231338101
asked Nov 19 '18 at 15:01
L.BBL.BB
132
asked Nov 19 '18 at 15:01
L.BBL.BB
132
asked Nov 19 '18 at 15:01
L.BBL.BB
132
132
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
What you're seeing there is that the layout engine calculates the width of the element before applying the transformation. One easy way to deal with this is to add a negative horizontal margin:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
margin: 0 -1.5em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>edited Nov 19 '18 at 15:31
user2154065
8062819
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
thank you so much!
– L.BB
Nov 19 '18 at 15:19
Prego, buona fortuna!
– nvioli
Nov 19 '18 at 15:20
add a comment |
Table data with 1% width having a paragraph which simply we can rotate but when there is more or less character you have to manually adjust margin and padding for the center class.
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
margin: 0 -1.6em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
Can you add some explanation to your solution? Which steps are neccessary?
– Nico Haase
Nov 19 '18 at 16:33
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53377340%2fhow-can-i-fully-control-a-div-rotation%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
What you're seeing there is that the layout engine calculates the width of the element before applying the transformation. One easy way to deal with this is to add a negative horizontal margin:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
margin: 0 -1.5em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>edited Nov 19 '18 at 15:31
user2154065
8062819
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
thank you so much!
– L.BB
Nov 19 '18 at 15:19
Prego, buona fortuna!
– nvioli
Nov 19 '18 at 15:20
add a comment |
What you're seeing there is that the layout engine calculates the width of the element before applying the transformation. One easy way to deal with this is to add a negative horizontal margin:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
margin: 0 -1.5em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>edited Nov 19 '18 at 15:31
user2154065
8062819
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
thank you so much!
– L.BB
Nov 19 '18 at 15:19
Prego, buona fortuna!
– nvioli
Nov 19 '18 at 15:20
add a comment |
What you're seeing there is that the layout engine calculates the width of the element before applying the transformation. One easy way to deal with this is to add a negative horizontal margin:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
margin: 0 -1.5em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>edited Nov 19 '18 at 15:31
user2154065
8062819
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
What you're seeing there is that the layout engine calculates the width of the element before applying the transformation. One easy way to deal with this is to add a negative horizontal margin:
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
margin: 0 -1.5em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
margin: 0 -1.5em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
writing-mode: lr-tb;
margin: 0 -1.5em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>edited Nov 19 '18 at 15:31
user2154065
8062819
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
edited Nov 19 '18 at 15:31
user2154065
8062819
edited Nov 19 '18 at 15:31
user2154065
8062819
edited Nov 19 '18 at 15:31
user2154065
8062819
8062819
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
answered Nov 19 '18 at 15:07
nviolinvioli
2,60031429
2,60031429
thank you so much!
– L.BB
Nov 19 '18 at 15:19
Prego, buona fortuna!
– nvioli
Nov 19 '18 at 15:20
add a comment |
thank you so much!
– L.BB
Nov 19 '18 at 15:19
Prego, buona fortuna!
– nvioli
Nov 19 '18 at 15:20
thank you so much!
– L.BB
Nov 19 '18 at 15:19
thank you so much!
– L.BB
Nov 19 '18 at 15:19
Prego, buona fortuna!
– nvioli
Nov 19 '18 at 15:20
Prego, buona fortuna!
– nvioli
Nov 19 '18 at 15:20
add a comment |
Table data with 1% width having a paragraph which simply we can rotate but when there is more or less character you have to manually adjust margin and padding for the center class.
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
margin: 0 -1.6em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
Can you add some explanation to your solution? Which steps are neccessary?
– Nico Haase
Nov 19 '18 at 16:33
add a comment |
Table data with 1% width having a paragraph which simply we can rotate but when there is more or less character you have to manually adjust margin and padding for the center class.
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
margin: 0 -1.6em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
Can you add some explanation to your solution? Which steps are neccessary?
– Nico Haase
Nov 19 '18 at 16:33
add a comment |
Table data with 1% width having a paragraph which simply we can rotate but when there is more or less character you have to manually adjust margin and padding for the center class.
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
margin: 0 -1.6em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
Table data with 1% width having a paragraph which simply we can rotate but when there is more or less character you have to manually adjust margin and padding for the center class.
.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
margin: 0 -1.6em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
margin: 0 -1.6em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>.rotate {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
transform: rotate(270deg);
margin: 0 -1.6em;
}<table class="TABELLA1" width="400px" align="left">
<tr height="90px">
<td width="1%">
<p id="idcliente" class="A8BL rotate">CLIENTE</p>
</td>
<td width="99%">
<div>
<div class="A8BL">
FACTORY 1<br>
253190 MILANO (IT)<br>
</div>
<div class="A8L">
Tel. 02 669172284<br>
e-mail: info@alufaoj.it
Cod. Fisc. <br>
e Partita IVA 2251364245341126
</div>
</div>
</td>
</tr>
</table>answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
edited Nov 20 '18 at 1:38
answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
answered Nov 19 '18 at 15:36
Prameshwar KumarPrameshwar Kumar
574
574
Can you add some explanation to your solution? Which steps are neccessary?
– Nico Haase
Nov 19 '18 at 16:33
add a comment |
Can you add some explanation to your solution? Which steps are neccessary?
– Nico Haase
Nov 19 '18 at 16:33
Can you add some explanation to your solution? Which steps are neccessary?
– Nico Haase
Nov 19 '18 at 16:33
Can you add some explanation to your solution? Which steps are neccessary?
– Nico Haase
Nov 19 '18 at 16:33
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53377340%2fhow-can-i-fully-control-a-div-rotation%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
