Jump to content

Div layout with stretching columns bug

Rodis

By Rodis
in CSS Help

 Share

Recommended Posts

Rodis Newbie

Rodis

Posted
Posted

Hello,

 

I am getting crazy trying to get my div layout to stretch propperly. I have tried many solutions to have 3 floated columns stretch to an equal height. right now i have the faux column but here's the deal. When i fill up my left column with a lot of text everything works properly and all 3 columns stretch out to an equal height. example url:

http://projecten.startbasis.nl/templatetest/index2.html  

 

But here comes my problem when fill out the right column with more text then the left it dissapears and none of the tables stretch to an equal hight.

http://projecten.startbasis.nl/templatetest/

 

i cannot seem to find the problem maybe one of you can have a fresh and more experienced look as i have not managed to put my site in div layout yet :-(

 

Hope someone can help me out here's my code.

 

CSS:

@charset "utf-8";
/* CSS Document */

body,html {
margin: 0px;
padding: 0px;
text-align:center;
}
#wrapper {
margin:0px auto;
padding:0px;
width:100%;
text-align:left;
}
#header {
width: 100%;
height:172px;
background-color: #0F0;
background-image:url(../images/header_bg.gif);
background-repeat:repeat-x;
}
#logo {
float:left;
border:solid;
width:20px;
height:20px;
}
#banner_top {
width:468px;
height:68px;
background-color:#FFF;
float:right;
margin:40px;
}
#navbar {
height:20px;
background-color:#CCC;
background-image:url(../images/navbar_bg.gif);
background-repeat:repeat-x;
font-style:oblique;
font-weight:bold;
margin:0;
}
/* 3 columns wrapper */
#column_wrapper {
margin:0px auto;
padding:0px;
width:100%;
overflow:hidden;
position:relative;
}
#left_column {
float: left;
width: 200px;
height:100%;
min-height:100%;
margin:0px auto;
padding:0px;
padding-bottom:60px;
background-color: #FFF;
background-image:url(../images/left_side_bar.png);
background-repeat:repeat-y;
}
.left_menu {
width:190px;
height:100%;
margin:0px auto;
padding:5px;
border-width:1px;
border-bottom-style:dotted;
border-bottom-color:#333;
overflow:visible;
}
#content_column {
float:left;
height:100%;
min-height:100%;
margin-left:200px;
margin-right:150px;
overflow:hidden;
padding:20px;
background-color:#FFF;
position:absolute;
left:0;
top:0;
right:0;
}
#right_column {
float: right;
width: 150px;
height:100%;
min-height:100%;
margin:0px auto;
padding:0px;
background-color: #0FF;
background-image:url(../images/side_box_bg_r.gif);
background-repeat:repeat-y;
position:absolute;
top:0;
right:0;
}
#footer {
clear:both;
margin:0px auto;
padding-left:20px;
background-color: #0F0;
width:100%;
height:60px;
background-image:url(../images/footer.gif);
background-repeat:repeat-x;
position:absolute;
}
#validators {
float:left;
width:auto;
height:auto;
}

html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Template test</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
</head>

<body>
<div id="wrapper">
<div id="header">
<div id="logo">Logo</div>
<div id="banner_top">Banner</div><!--banner top -->
</div><!--header -->
<div id="navbar">Navbar</div>
<div id="column_wrapper">
<div id="left_column">
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu and more of the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
</div><!--left_column -->
<div id="content_column">
"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."
"Er is niemand die van pijn zelf houdt, die het zoekt en die het hebben wil, eenvoudigweg omdat het pijn is..."


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ut purus nec sapien vulputate aliquam eget ut nisl. Donec malesuada elementum arcu, sed congue odio tempus vel. Nam congue molestie elit non pretium. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus est arcu, fermentum et malesuada nec, tincidunt sit amet velit. Morbi id massa et nibh accumsan elementum. Aliquam eu sapien vitae sem suscipit feugiat. Donec in sem et lacus tincidunt aliquet. Proin nec vehicula quam. Morbi mattis scelerisque luctus. Etiam rutrum lorem eu lacus sagittis ornare. 

Suspendisse suscipit turpis eget dolor dapibus mattis. Vestibulum nisi erat, pretium non imperdiet sit amet, ornare sed eros. Suspendisse imperdiet dapibus mattis. Proin imperdiet ligula condimentum magna egestas consequat. Curabitur posuere aliquam arcu eget vehicula. Vivamus mi dolor, varius condimentum luctus at, dignissim malesuada lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur in lorem ipsum. Maecenas hendrerit commodo molestie. Ut rhoncus urna a dui vestibulum quis sodales lorem volutpat. Suspendisse felis sem, sagittis in lobortis et, semper eget nulla. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi hendrerit odio at sapien pretium non posuere arcu venenatis. Suspendisse iaculis interdum turpis sit amet malesuada. Etiam eget eros sit amet quam ornare mattis a quis tellus. 
</div><!--content_column -->
<div id="right_column">
  <div class="lipsum2">
    <p>  </p>
    <ul>
      <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
      <li>Curabitur a leo eget tortor consectetur consectetur.</li>
      <li>Donec nec est quis ante luctus feugiat.</li>
      <li>Ut ut turpis lorem, non sodales quam.</li>
      <li>Cras sit amet orci id mauris cursus adipiscing.</li>
    </ul>
    <p>  </p>
    <ul>
      <li>Proin pretium elit ut dolor ornare a fringilla enim varius.</li>
      <li>Cras sit amet erat ut tellus congue consequat.</li>
      <li>Aliquam ac odio nec justo faucibus consequat.</li>
      <li>Suspendisse in nisi neque, eget aliquet tortor.</li>
      <li>Fusce sit amet erat ut purus ullamcorper suscipit.</li>
    </ul>
  </div>
</div><!--right_column -->
</div><!--column wrapper -->
<div id="footer">
<div id="validators">
<a href="http://validator.w3.org/check?uri=referer">
<img style="border:0;width:88px;height:31px"
        src="http://www.w3.org/Icons/valid-xhtml10-blue"
        alt="Valid XHTML 1.0 Transitional" /></a>
 
<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px"
        src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
        alt="Valide CSS!" />
</a>
</div><!--validators -->
</div><!--footer -->
</div><!--wrapper -->
</body><!--close body -->
</html><!--close html -->

Hope someone can help me out thank you advance

Link to comment
https://forums.phpfreaks.com/topic/226968-div-layout-with-stretching-columns-bug/
Share on other sites
denno020 Regular Member

denno020

Posted
Posted

Have you tried floating the right column to the left too? So then it's placed directly after the two columns before it.. I'm not sure if floating it right will put it on a different display 'zone' or whatever.. Maybe try that.

 

 

Denno

Rodis Newbie

Rodis

Posted
  • Author
Posted

Yes i had already tried that one out too. i have been trying a lot of things lol had some trouble to have them displayed the same in cross browser, then i thought i had it until the content in the columns changed. then i saw that everything adjusts to the left column but not to any other column. the text in the right now dissapears behind the page i had a style that didn't let it dissapear but still this same problem appeared. it's weired i have been googling and spying in other layouts i have no idea what i am doing wrong sniffff. :-(

i really want this to work as i am busy on some new code for my page and i want the layout to be vallid xhtml and css. But thanks for trying anyways :-)

denno020 Regular Member

denno020

Posted
Posted

as raknjak just said, position:absolute; wasn't helping at all.

I just disabled that css property, and the footer moved perfectly to the bottom of the right column. The left column however, didn't drop to be the same height..

 

Denno

raknjak Newbie

raknjak

Posted
Posted

yes, I noticed that, too.

The example I posted uses a background for that: browncol.gif which is repeated vertically. I don't know any other technique.

 

What you could do is start off with that template and then insert your customizations. This is just a suggestion off course, I just noticed that when I do it like that I save huge bundles of time.

Rodis Newbie

Rodis

Posted
  • Author
Posted

OK thanks im going to get this layout and start mine from ground up again hope i wil get what i want. it all looked simple when i started lol, why doesnt ie just implement all css like ff just keep one standard grrrr I still think tables are much easier hehehhe  8)

Rodis Newbie

Rodis

Posted
  • Author
Posted

Ok so i changed a few things i have a way to stretch it to the same hight http://projecten.startbasis.nl/templatetest/index1.html but when placing the right column div to its position i am back to the begining. as seen in http://projecten.startbasis.nl/templatetest/index2.html

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Template test</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
</head>

<body>
<div id="wrapper">
<div id="header">
<div id="logo">Logo</div>
<div id="banner_top">Banner</div><!--banner top -->
</div><!--header -->
<div id="navbar">Navbar</div>
<div id="column_wrapper" class="column">
<div id="left_column" class="column">
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu and more of the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
</div><!--left_column -->
<div id="content_column" class="column">
"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."
"Er is niemand die van pijn zelf houdt, die het zoekt en die het hebben wil, eenvoudigweg omdat het pijn is..."


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ut purus nec sapien vulputate aliquam eget ut nisl. Donec malesuada elementum arcu, sed congue odio tempus vel. Nam congue molestie elit non pretium. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus est arcu, fermentum et malesuada nec, tincidunt sit amet velit. Morbi id massa et nibh accumsan elementum. Aliquam eu sapien vitae sem suscipit feugiat. Donec in sem et lacus tincidunt aliquet. Proin nec vehicula quam. Morbi mattis scelerisque luctus. Etiam rutrum lorem eu lacus sagittis ornare. 

Suspendisse suscipit turpis eget dolor dapibus mattis. Vestibulum nisi erat, pretium non imperdiet sit amet, ornare sed eros. Suspendisse imperdiet dapibus mattis. Proin imperdiet ligula condimentum magna egestas consequat. Curabitur posuere aliquam arcu eget vehicula. Vivamus mi dolor, varius condimentum luctus at, dignissim malesuada lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur in lorem ipsum. Maecenas hendrerit commodo molestie. Ut rhoncus urna a dui vestibulum quis sodales lorem volutpat. Suspendisse felis sem, sagittis in lobortis et, semper eget nulla. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi hendrerit odio at sapien pretium non posuere arcu venenatis. Suspendisse iaculis interdum turpis sit amet malesuada. Etiam eget eros sit amet quam ornare mattis a quis tellus. 
</div><!--content_column -->
<div id="right_column" class="column">
  <div class="lipsum2">
    <p>  </p>
    <ul>
      <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
      <li>Curabitur a leo eget tortor consectetur consectetur.</li>
      <li>Donec nec est quis ante luctus feugiat.</li>
      <li>Ut ut turpis lorem, non sodales quam.</li>
      <li>Cras sit amet orci id mauris cursus adipiscing.</li>
    </ul>
    <p>  </p>
    <ul>
      <li>Proin pretium elit ut dolor ornare a fringilla enim varius.</li>
      <li>Cras sit amet erat ut tellus congue consequat.</li>
      <li>Aliquam ac odio nec justo faucibus consequat.</li>
      <li>Suspendisse in nisi neque, eget aliquet tortor.</li>
      <li>Fusce sit amet erat ut purus ullamcorper suscipit.</li>
    </ul>
  </div>
</div><!--right_column -->
</div><!--column wrapper -->
<div id="footer">
<div id="validators">
<a href="http://validator.w3.org/check?uri=referer">
<img style="border:0;width:88px;height:31px"
        src="http://www.w3.org/Icons/valid-xhtml10-blue"
        alt="Valid XHTML 1.0 Transitional" /></a>
 
<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px"
        src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
        alt="Valide CSS!" />
</a>
</div><!--validators -->
</div><!--footer -->
</div><!--wrapper -->
</body><!--close body -->
</html><!--close html -->


@charset "utf-8";
/* CSS Document */

body,html {
margin: 0px;
padding: 0px;
text-align:center;
}
#wrapper {
text-align:left;
}
#header {
background-image:url(../images/header_bg.gif);
height:172px;
width:100%;
}
#logo {
float:left;
background-image:url(../images/logo_sb.gif);
background-repeat:no-repeat;
height:150px;
width:300px;
}
#banner_top {
float:right;
height:60px;
width:468px;
background-color:#CCC;
}
#navbar {
clear:both;
background-image:url(../images/navbar_bg.gif);
height:20px;
width:100%;
}
/* 3 columns wrapper */
#column_wrapper {
overflow:hidden;
position: relative;
}
/* This will make sure the columns get stretched */
#column_wrapper .column {
		padding-bottom: 1001em;     
		margin-bottom: -1000em;     
	}
#left_column {
float:left;
background-image:url(../images/left_side_bar.png);
background-repeat:repeat-y;
width:200px;
}
.left_menu {
border-bottom-style:dotted;
border-bottom-width:1px;
}
#content_column {
margin-left:200px;
margin-right:151px;
padding:10px;

}
#right_column {
float:right;
background-image:url(../images/side_box_bg_r.gif);
background-repeat:repeat-y;
width:151px;
}
#footer {
clear:both;
background-image:url(../images/footer.gif);
height:60px;
width:100%;
}
#validators {
}

so in the second example i have added

position:absolute;
top:0px;
right:0px;

To the right column so it gets to his position it needs to go but then still text disapears and everything is only stretched to th eleft and middle container :-( how to resolve this?

Rodis Newbie

Rodis

Posted
  • Author
Posted

Got it solved :-D As stated in my last post my only problem left was that the right column was placed and floated to the right but started below the main content div. by placing the right div before the maincontent it showed up properly so this is my code 

@charset "utf-8";
/* CSS Document */

body,html {
margin: 0px;
padding: 0px;
text-align:center;
}
.leftflt {
float:left;
}
.rightflt {
float:right;
}
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
#outer-wrapper {
padding:0px;
margin:0px auto;
background-image:url(../images/side_box_bg_r.gif);
background-repeat:repeat-y;
background-position:right;
width:100%;
}
#wrapper {
padding:0px;
margin:0px auto;
background-image:url(../images/left_side_bar.png);
background-repeat:repeat-y;
text-align:left;
display:inline-block;
width:100%;
}
#header {
background-image:url(../images/header_bg.gif);
height:172px;
width:100%;
}
#logo {
float:left;
background-image:url(../images/logo_sb.gif);
background-repeat:no-repeat;
height:150px;
width:300px;
}
#banner_top {
float:right;
height:60px;
width:468px;
background-color:#CCC;
}
#navbar {
background-image:url(../images/navbar_bg.gif);
height:20px;
width:100%;
}
/* 3 columns wrapper */
#column-wrapper {
margin:0px;
padding:0px;
overflow:hidden;
}
#left-column {
float:left;
width:200px;
z-index:1;
}
.left_menu {
border-bottom-style:dotted;
border-bottom-width:1px;
}
#content-column {
margin:0px 151px 0px 200px;
padding:10px;
z-index:3;
}
#text {
border:solid 1px;
}
#right-column {
float:right;
width:151px;
z-index:2;
}
#lipsum2 {
}
#footer {
clear:both;
background-image:url(../images/footer.gif);
height:60px;
width:100%;
}
#validators {
}

and my html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Template test</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
</head>

<body>
<div id="outer-wrapper">
<div id="wrapper">
<div id="header">
<div id="logo">Logo</div>
<div id="banner_top">Banner</div><!--banner top -->
</div><!--header -->
<div class="clearfloat"></div>
<div id="navbar">Navbar!..
</div><!--navbar -->
<div id="column-wrapper" class="column">
<div id="left-column" class="column">
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu and more of the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
<div class="left_menu">This is the menu</div><!--left menu -->
</div><!--left_column -->
<div id="right-column" class="column">
  <div class="lipsum2">
    <p>Right column </p>
    <ul>
      <li>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
      <li>Curabitur a leo eget tortor consectetur consectetur.</li>
      <li>Donec nec est quis ante luctus feugiat.</li>
      <li>Ut ut turpis lorem, non sodales quam.</li>
      <li>Cras sit amet orci id mauris cursus adipiscing.</li>
    </ul>
    <p>  </p>
    <ul>
      <li>Proin pretium elit ut dolor ornare a fringilla enim varius.</li>
      <li>Cras sit amet erat ut tellus congue consequat.</li>
      <li>Aliquam ac odio nec justo faucibus consequat.</li>
      <li>Suspendisse in nisi neque, eget aliquet tortor.</li>
      <li>Fusce sit amet erat ut purus ullamcorper suscipit.</li>
    </ul>
  </div>
</div><!--right-column -->
<div id="content-column" class="column">
<div id="text">
"Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit..."
"Er is niemand die van pijn zelf houdt, die het zoekt en die het hebben wil, eenvoudigweg omdat het pijn is..."


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ut purus nec sapien vulputate aliquam eget ut nisl. Donec malesuada elementum arcu, sed congue odio tempus vel. Nam congue molestie elit non pretium. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus est arcu, fermentum et malesuada nec, tincidunt sit amet velit. Morbi id massa et nibh accumsan elementum. Aliquam eu sapien vitae sem suscipit feugiat. Donec in sem et lacus tincidunt aliquet. Proin nec vehicula quam. Morbi mattis scelerisque luctus. Etiam rutrum lorem eu lacus sagittis ornare. 

Suspendisse suscipit turpis eget dolor dapibus mattis. Vestibulum nisi erat, pretium non imperdiet sit amet, ornare sed eros. Suspendisse imperdiet dapibus mattis. Proin imperdiet ligula condimentum magna egestas consequat. Curabitur posuere aliquam arcu eget vehicula. Vivamus mi dolor, varius condimentum luctus at, dignissim malesuada lectus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur in lorem ipsum. Maecenas hendrerit commodo molestie. Ut rhoncus urna a dui vestibulum quis sodales lorem volutpat. Suspendisse felis sem, sagittis in lobortis et, semper eget nulla. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Morbi hendrerit odio at sapien pretium non posuere arcu venenatis. Suspendisse iaculis interdum turpis sit amet malesuada. Etiam eget eros sit amet quam ornare mattis a quis tellus. 
</div><!--text -->
</div><!--content-column -->
<div class="clearfloat"></div>
</div><!--column-wrapper -->
<div id="footer">
<div id="validators">
<a href="http://validator.w3.org/check?uri=referer">
<img style="border:0;width:88px;height:31px"
        src="http://www.w3.org/Icons/valid-xhtml10-blue"
        alt="Valid XHTML 1.0 Transitional" /></a>
 
<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px"
        src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
        alt="Valide CSS!" />
</a>
</div><!--validators -->
</div><!--footer -->
</div><!--wrapper -->
</div><!--outer-wrapper -->
</body><!--close body -->
</html><!--close html -->

http://projecten.startbasis.nl/templatetest/index1.html

Thanks for the help anyways hope someone can use my solution

This thread is more than a year old. Please don't revive it unless you have something important to add.

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.   Restore formatting

  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.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.