auto height

10 replies [Last post]

Thu, 2010-09-09 22:02

comatoseduck

Offline

Regular

Timezone: GMT-5

Joined: 2010-06-03

Posts: 25

Points: 42

I have a sub nav to the left of my page and I would like for it to "grow" depending on the content to the left. This is unfortunately harder than it sounds for me. I have been scouring the interwebs and have found many articles on flexible heights but none that have helped me. I have tried overflow:hidden, adding position:absolute, adding another div that contains everything. Basically I know I'm just missing something. Any help is always appreciated!!!!!!

@charset "UTF-8";
/* CSS Document */
 
body,td,th {
	color: #999;
	font-family: 'Nobile',arial, verdana, tahoma, helvetica;
	font-size: 100%;
	height: 640px;
}
body {
	background-color: #041638;
	background-image: url(images/bg.gif);
	background-repeat: repeat-x;
	background-position: top center;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
#feedback p {margin-bottom:5px;}
p.error {display:none; padding:5px 0px; color:#FF3300; font-weight:bold;}
p#submit {text-align:right;}
p#success {display:none; font-size:16px; text-align:left; margin-bottom:20px; color:#00abe0; font-style:italic;}
 
/** Contact us Form **/
 
#contact_us {width:460px; margin:25px 0px 0px; overflow:hidden;}
textarea#styled {
	border: 3px solid #cccccc;
	padding: 5px;
	font-family: "Lucida Sans Unicode", "Lucida Grande", Garuda, sans-serif;
 
}
 
#contact_us p.label_name, #contact_us p.input_form {float:left; margin-bottom:10px;}
p.label_name {width:80px; clear:both; color:#7f7e7e; font-size:13px;}
 
#contact_us input, #contact_us textarea {width:370px; background:#fff; border:#CACACA 1px solid; font-size:12px; padding:4px; margin-bottom:15px; color:#6E6E6E; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; font-family:"Lucida Sans Unicode", "Lucida Grande", Garuda, sans-serif;}
#contact_us input.button {cursor:pointer; width:auto; float:right; font-size:12px;}
 
#feedback p {margin-bottom:5px;}
p.error {display:none; padding:5px 0px; color:#FF3300; font-weight:bold;}
p#submit {text-align:right;}
p#success {display:none; font-size:16px; text-align:left; margin-bottom:20px; color:#00abe0; font-style:italic;}
 
 
/* --------------------- FONTS --------------------- */
 
 
h1, h2, h3{color:#515151;}
 
p, dl, td {
	font-size: 12px;
	font-weight: normal;
	margin: 0 0px 15px;
	color: #5b6b75;
}
.section p{margin-bottom:1.66667em;}
 
.section p.small_para{font-size:0.6875em; line-height:1.818181em; color:#acb1b7}
 
.section p span.star{color:#1B8AD3;}
 
 
/* H1 */
 
h1{
	letter-spacing:normal;
}
.work_info h1 {font-size: 14px;}
#home h1, #hub h1{font-size:2em;}
#home h1{padding:34px 0 7px 0}
#hub h1{padding:30px 0 7px 0}
#quote h1{padding:28px 0 10px 0}
#home h1{font-weight:bold; }
#quote h1, #content h1{font-size:1.875em;}
#content h1{
	font-size:18px;
	margin-bottom:0.3em
}
 
/* H2 */
 
#home .section h2{font-size:1.5625em; letter-spacing:-1px; padding-bottom:16px;}
#hub .section h2{font-size:1.125em; letter-spacing:-1px;}
#quote .section h2{font-size:1.25em; color:#0075C7; letter-spacing:-1px; padding-bottom:20px;}
#quote .section h2.welldone{font-size:1.375em; color:#0075C7; letter-spacing:-1px; padding-bottom:20px; position:relative; top:-4px;}
#quote .section h2.welldone span{font-size:0.727272em; color:#1B2533;}
#quote .section h2.para{padding-bottom:9px;}
#quote .section h2.phone{float:right; padding-bottom:0px; font-size:14px; letter-spacing:-0.01em; text-transform:uppercase; line-height:23px;}
 
#content .section h2{font-size:1.125em; letter-spacing:-0.03em; margin-bottom:1em; line-height:1em;}
 
/* H3 */
 
#home .aside h3{font-size:1.125em; letter-spacing:-0.047em}
#quote .aside h3{font-size:1em; color:#fff;}
#quote .aside .current h3{display:block; background:url(images/backgrounds/dotted_h_white.gif) repeat-x bottom left; padding-bottom:12px; margin-bottom:13px;}
#content .aside h3{font-size:1.125em; color:#fff; padding-bottom:9px; }
#quote .aside .help_box h3, #content .aside .help_box h3{color:#1a232f; padding-bottom:9px;}
#quote .aside .rotate h3{line-height:22px;}
.hub_bottom h3{font-size:1.125em; letter-spacing:-0.03em; margin-top:-2px;}
/* H4 */
 
/* Primary */
.primary {
	width: 630px;
	padding: 15px 0 10px 0;
	margin:0 0 5px 340px;
}
 
.primary h1 {
	font-size: 18px;
	font-weight: normal;
	line-height: 1.2;
	color: #5b6b75;
	margin: 20px 20px 10px 0px;
}
.primary h2 {
	font-size: 22px;
	font-weight: normal;
	line-height: 1.2;
	color: #333;
	margin: 20px 20px 10px 0px;
}
 
.primary ol {
	list-style-position: outside;
	list-style-type: decimal;
	font-weight: normal;
	margin-left: 20px;
	padding: 0;
}
 
.primary ul {
	list-style-position: outside;
	margin: 0 20px 15px;
}
 
.primary li {
	font-size: 12px;
	font-weight: normal;
	margin: 0 20px 15px;
	color: #5b6b75;
	list-style-image: url(images/check.jpg);
}
 
.divider {
	clear: right;
	border-bottom: 1px dotted #CCC;
	margin: 20px;
	margin-left: 0px;
}
 
#accordion .divider {
	clear: right;
	border-bottom: 1px dotted #CCC;
	margin: 15px 20px;
}
/* P */
 
 
#content .section p.intro_dotted{font-size:0.875em; line-height:1.42857em; margin-bottom:1.6429em; padding-bottom:1.42857em; background:url(images/backgrounds/dotted_h.gif) repeat-x bottom left;}
#content .gal_section p.intro_dotted{margin-top:-32px; margin-bottom:14px;}
 
#content .aside p strong{color:#fff; font-weight:normal; display:block; padding-bottom:9px;}
 
#content .aside p a{color:#fff; text-decoration:none; display:block; padding-bottom:9px; }
#content .aside p a:hover{text-decoration:underline;}
 
#content .aside .help_box p{padding-bottom:13px;}
#content .aside .contact_form p{padding-bottom:13px; margin-top:-3px;}
 
#content .aside .contact p{padding-bottom:3px;}
 
 
.wrap_middle{
	background:url(images/backgrounds/glow_bg.jpg) no-repeat top center;	
	display:block;
}
#wrapper {
	width: 100%;
	padding-bottom: 0px;
	background:url(images/glow_bg.jpg) no-repeat top center;
	display:block;
	vertical-align: bottom;
	padding-top: 30px;
}
#content {
	width: 990px;
	background: #FFF;
	border: 0px solid #dcdcdc;
	clear: both;
	margin: auto;
	position:relative;
	height: 100%;
	background-repeat: no-repeat;
	background-image: url(images/main_bott_bg.gif);
	background-position: bottom;
	padding-bottom: 10px;
}
#main{
	padding: 0;
}
/*------------------------------------------------------------------------------------
      Navigation
    ------------------------------------------------------------------------------------*/
#register{
	background: url(images/topmenu.png);
	height: 39px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	position: relative;
	text-align:  center;
	font-family: 'Nobile', Helvetica, Arial, sans-serif;
}
#register ul {
	display: inline;
	line-height: 1.4;
}
#register ul li {
	display: inline;
	float: right;
	padding-right: 50px;
	padding-top: 12px;
}
#register ul li a {
	text-decoration: none;
	color: #515151;
	font-size: 10px;
}
#register ul li a:hover {
	color: #14619d;
}
 #register li.active a {
	color: #14619d;
}
#page
{
	line-height: 1; 
	background:#041634 url(../images/bg.gif) repeat-x top left;	
	color:#5b6b75;
}
#container
{
	margin: 0 auto;
	width: 990px;
	height: auto
}
 
#header {
	width: 990px;
	margin: 0 auto;
	height: 50px;
	padding-left: 20px;
}
 
#header h1 {
	margin: 0;
	clear: both;
}
/* ============== */
/* ! Navigation   */
/* ============== */
#navbar{
	background: url(images/topmenu.png);
	height: 39px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	position: relative;
	text-align:  center;
	font-family: 'Nobile', Helvetica, Arial, sans-serif;
}
#navbar ul {
	display: inline;
}
#navbar ul li {
	display: inline;
	float: right;
	padding-right: 50px;
	padding-top: 12px;
}
#navbar ul li a {
	text-decoration: none;
	color: #515151;
	font-size: 10px;
}
#navbar ul li a:hover {
	color: #14619d;
}
 #navbar li.active a {
	color: #14619d;
}
/* ================= */
/* ! LEFT SIDE NAV   */
/* ================= */
 
#navleft
{
	background-color: white;
	height: inherit;
	margin-bottom: 5px;
 
}
.bl 
{
	border-style: solid;
	border-width: thin;
	border-color: #CCC;
	margin-left: 10px;
	background: #EFEFEF;
	padding: 10px;
	margin-top: 10px;
	width: 28%;
	float: left;
	border-radius:5px;
	-moz-border-radius: 5px;
	height: 1310px;
 
}
.bl2 
{
	border-style: solid;
	border-width: thin;
	border-color: #CCC;
	margin-left: 10px;
	background: #EFEFEF;
	padding: 10px;
	margin-top: 10px;
	width: 28%;
	float: left;
	border-radius:5px;
	-moz-border-radius: 5px;
	height: 725px;
 
}
.bl3 
{
	border-style: solid;
	border-width: thin;
	border-color: #CCC;
	margin-left: 10px;
	background: #EFEFEF;
	padding: 10px;
	margin-top: 10px;
	width: 28%;
	float: left;
	border-radius:5px;
	-moz-border-radius: 5px;
	height: 1133px;
 
}
.bl4 
{
	border-style: solid;
	border-width: thin;
	border-color: #CCC;
	margin-left: 10px;
	background: #EFEFEF;
	padding: 10px;
	margin-top: 10px;
	width: 28%;
	float: left;
	border-radius:5px;
	-moz-border-radius: 5px;
	height: 725px;
 
}
.bl5 
{
	border-style: solid;
	border-width: thin;
	border-color: #CCC;
	margin-left: 10px;
	background: #EFEFEF;
	padding: 10px;
	margin-top: 10px;
	width: 28%;
	float: left;
	border-radius:5px;
	-moz-border-radius: 5px;
	height: 725px;
 
}
.bl6 
{
	border-style: solid;
	border-width: thin;
	border-color: #CCC;
	margin-left: 10px;
	background: #EFEFEF;
	padding: 10px;
	margin-top: 10px;
	width: 28%;
	float: left;
	border-radius:5px;
	-moz-border-radius: 5px;
	height: 1135px;
 
}
#menu{
	padding-left: 10px;
	line-height: 30px;
	font-family: Helvetica, arial, veranda, tahoma;
	font-size: 12px;
	list-style-type: none;
	padding-top: 10px;
 
}
#menu li {
	float: left;
	margin: 0;
	width: 265px;
	padding-bottom: 3px;
 
}
#menu li a {
text-decoration: none;
display: block;
color: #515151;
text-align: justify;
}
#menu li a:hover, #menu li.active a {
margin-left: -15px;
background-color: #329ffa;
border-radius:3px;
-moz-border-radius: 3px;
color: white; 
width: 265px;
padding-left: 15px;
}
#menu p{
font-family: "Helvetica Neue";
font-weight: 600;
font-size: 12px;
color: #0f3368;
margin-top:-10px;
}
/* ========== */
/* ! DESIGN   */
/* ========== */
 
.id_box h3{
	word-spacing: 3px;
	font-family: 'Lobster', cursive;
	font-weight: 100;
	color: #26aade;
}
.id_box{
	font-family: , cursive;
	margin-left: 4px;
	height: inherit;
}
.id_box h1{
	font-size: 18px;
	font-weight: normal;
	line-height: 1.2;
	color: #5b6b75;
	margin: 13px 20px 10px 0px;
	}
.blocks {
	float: left;
	width: 270px;
	height: 176px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	display: inline;
	margin-top: 20px;
	background-image: url(images/sidebarbox.jpg);
}
.blocks img{
	border-top-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	border-top-right-radius: 5px;
	-moz-border-radius-topright: 5px;
}
.design_box{
	width: 630px;
	padding: 1px 0 10px 0;
	margin:0 0 5px 0px;
}
.design_box p{
	font-size: 10px;
}
.design_box h2 {
	font-size: 14px;
}
.design_box h1{
	text-transform:uppercase;
	font-size: 12px;
}
/* ================== */
/* ! PORTFOLIO/WORK   */
/* ================== */
 
.work_info{
	word-spacing: 5px;
	width: 675px;
	margin-bottom: 0;
	padding-top: 1px;
	margin-left: 300px;
}
.work_info p{
	font-size: 10px;
}
.work_vss
{
	background-repeat: no-repeat;
	background-image: url(images/work-vss.png);
	position: relative;
	padding: 10px;
	float: left;
	margin-top: 10px;
	margin-left: 10px;
	margin-bottom: 10px;
	height: 861px;
	width: 675px; 
}
.work_edwards
{
	background-repeat: no-repeat;
	background-image: url(images/work-edwards.png);
	position: relative;
	padding: 10px;
	float: left;
	margin-top: 10px;
	margin-left: 10px;
	margin-bottom: 10px;
	height: 910px;
	width: 675px; 
}
.work_tricorp
{
	background-repeat: no-repeat;
	background-image: url(images/work-tricorp.png);
	position: relative;
	padding: 10px;
	float: left;
	margin-top: 10px;
	margin-left: 21px;
	margin-bottom: 10px;
	height: 697px;
	width: 670px; 
}
.work_urban
{
	background-repeat: no-repeat;
	background-image: url(images/work-urban.png);
	position: relative;
	padding: 10px;
	float: left;
	margin-top: 10px;
	margin-left: 21px;
	margin-bottom: 10px;
	height: 820px;
	width: 670px; 
}
.work_nds
{
	background-repeat: no-repeat;
	background-image: url(images/work-nds.png);
	position: relative;
	padding: 10px;
	float: left;
	margin-top: 10px;
	margin-left: 21px;
	margin-bottom: 10px;
	height: 908px;
	width: 670px; 
}
#bottomcurve {
	height: 10px;
	position: static;
}
#footer{
	background-repeat: no-repeat;
	background-position: center;
	clear: both;
	vertical-align: top;
	margin: 0 auto;
	width: 990px;
	padding-top: 7px;
}
#footer_work{
	text-align: center;
	margin-top: 0;
	position: relative;
}
#footer_work img {
	margin-top: -125px;
	}

Tags:

Beginners CSS Questions

Thu, 2010-09-09 22:09

comatoseduck

Offline

Regular

Timezone: GMT-5

Joined: 2010-06-03

Posts: 25

Points: 42

<!DOCTYPE html PUBLIC

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title> Design . Development . Marketing</title>
 
 
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/default.js"></script>
<script type="text/javascript" src="HelveticaNeue_Light.font.js"></script>
<script type="text/javascript" src="js cornerz.js">
</script><script type="text/javascript" src="jquery.equalHeights.js"></script>
<script type="text/javascript" src="cufon-yui.js"></script>
 
<link href="base3.css" rel="stylesheet" type="text/css" />
</head>
<body>
 
 
<div id="wrapper">
 
 
<div id="header"> 
	<a href="index.html"><img src="images/mcmlogo.png" alt="" /></a>
 
</div>
 
 
 
<div id="content">
 
<div id="Menu" >
 <div id="navigation">
 
            <div id="register">
 
		<ul id="main_menu" class="nav-home">
			<li><a href="contactus.html">Contact Us</a></li>
			<li><a href="ourwork1.html">Our Work</a></li>
			<li><a href="marketing.html">Marketing</a></li>
			<li><a href="development.html">Development</a></li>
			<li><a href="design.html">Design</a></li>
		</ul>
		</div>
 
            	<div id="menuDiv" >
 
                    <div id="menu_content" class="Hide">
 
                    <div id="menu_columns">
 
                      </div>
 
                  </div>
 
 
      </div>
 
    </div>
 
 
  </div>   
 
	<div id="main">		
	  <div id="navleft">
      <div class="bl">
				<div class="id_box">
	<h1>Website Design</h1>
	<img src="images/id_line.png" alt=""/>
    <ul id="menu">
				<li class="active"><a href="ourwork1.html">VSS Carriers</a></li>
				<li><a href="ourwork2.html">Edwards Construction</a></li>
				<li><a href="ourwork3.html">Tricorp Transportation</a></li>
				<li><a href="ourwork4.html">Urban Taco</a></li>
				<li><a href="ourwork5.html">National Dental Sales</a></li>
                <li><a href="ourwork6.html">Southlake General Contractors</a></li>
			</ul>
            </div>
		</div>
	</div>
 
			<div class="primary">
              <h2><img src="images/process.png" width="24" height="24" alt=""/> Our Work tells our Story</h2> 
              <div class="divider"></div>
              <h1>VSS Carriers</h1>
              <p>VSS Carriers is an innovative leader in the transportation industry. They asked to create them their first website and to establish a strong presence. We began by refining their companies logo, and putting their name on the map with a social media package.</p>
<div class="divider"></div>
<img src="images/work_vss3.jpg" width="630" height="161" alt=""/>
<img src="images/work_vss.jpg" width="630" height="715" alt=""/>
<img src="images/work_vss2.jpg" width="630" height="222" alt=""/>
</div>
<div class="clearfloat"></div>
                <div class="main1_bottom"></div>
 
    </div>
</div>
  </div>
 
<!-- ****************************** CONTENT End ****************************** //-->
 
 
<!-- ****************************** FOOTER Start ****************************** //-->
 
 
 
<div id="footer">
   <!-- Footer END -->
 
</div>
</body>
 
<!-- ****************************** BODY End ****************************** //-->
 
</html>

Thu, 2010-09-09 23:13

Deuce

Offline

Guru

Timezone: GMT-6

Joined: 2005-11-20

Posts: 4416

Points: 1835

Research 'faux columns'.

all » http://dictionary.reference.com/browse/all

Google isn't a bunch of guys reading and grading web sites, it's more like a bunch of monkeys sniffing food and putting the good bananas at the top. -Triumph

Fri, 2010-09-10 10:58

Stomme poes

Offline

Elder

Timezone: GMT+2

Joined: 2008-02-04

Posts: 1854

Points: 378

Hey duck

Your problem is very simple. You are limiting the height of your page, by setting a height on the body. Be aware what height does: it SETS but also LIMITS height of an object.

The only time content inside something with a set height can grow is when it's allowed to overflow (spill out). If overflow is set to "hidden", you can't see it spilling out. If it's set to "auto", you get scrollbars. Overflow: visible is the default.

The best way to let content dictate the height is to never set height in the first place.

Be especially careful with height: 100%. It doesn't do what you think it does, and should only be used in very special circumstances.

Sometimes you always want a height of At Least X on an elemnet, even if there's not enough content, but also want it to grow if the content is larger. That's where you use min-height. Doesn't work in IE6 but you can use the Tan Hack to just give height to IE6 (it lets heights grow, contrary to all other browsers and contrary to the wc specs).
The only time you'd want something like that is if the element in question is visible (has a background-color or bakground-image, or a border). Otherwise, just leave height alone (it defaults to "auto" so you don't even need to say height: auto anywhere) and everyone will just do their thing.

The Faux Columns Deuce mentioned is a solution to the opposite problem: when you want the height of one element to match another (equal column height), even if the content inside the one element isn't enough to make it grow. One technique (of many many) for faux columns does make use of height: 100% in a special way... so if you need to use that, ask for clarification before using it, so that you understand what it's doing.

I'm no expert, but I fake one on teh Internets

Sun, 2010-09-12 17:48

comatoseduck

Offline

Regular

Timezone: GMT-5

Joined: 2010-06-03

Posts: 25

Points: 42

wow stomme, thanks so much

wow stomme, thanks so much for the explanations it helped clarify a lot. I think what I need to use is the faux columns because the content in one of the columns doesn't equal the content of the other column. I researched faux columns, and isn't it "cheating" a bit with the whole setting of the background image? What are the downsides to using faux columns?

Sun, 2010-09-12 18:30

Verschwindende

Offline

Guru

Timezone: GMT-5

Joined: 2009-10-09

Posts: 2037

Points: 2256

comatoseduck wrote: ... I

comatoseduck wrote:

... I researched faux columns, and isn't it "cheating" a bit with the whole setting of the background image? ...

WHAT?!?! Styling is about setting the look of a page. If the columns look full height then the columns look full height. How is it cheating?? Concerning styling, perception is reality.

comatoseduck wrote:

... What are the downsides to using faux columns?

Let me know when you discover one.

yet again.

Sun, 2010-09-12 18:48

Hugo

Offline

Moderator

Joined: 2004-06-06

Posts: 15095

Points: 2190

Whether or not Faux columns

Whether or not Faux columns are the solution for your issue, they are a tried and tested approach that has stood the test of time for the last 7 odd years as the most reliable method of dealing with the perceived issue of gaining equal height elements.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

Tue, 2010-09-14 10:40

Stomme poes

Offline

Elder

Timezone: GMT+2

Joined: 2008-02-04

Posts: 1854

Points: 378

We're cheaters

Quote:

I researched faux columns, and isn't it "cheating" a bit with the whole setting of the background image?

Totally. But that's what CSS does. It's all about fakery.

99% of the time, as you walk around the street, would it matter if you were really wearing clothes or just a hologram of clothes? Nope : )
And if it's winter, there's some other technology you should be using.

For example if you could get away with not worrying about IE6 or 7, you could use display: table.

I'm no expert, but I fake one on teh Internets

Tue, 2010-09-14 11:19

Hugo

Offline

Moderator

Joined: 2004-06-06

Posts: 15095

Points: 2190

Not only is it fakery but the

Not only is it fakery but the admission is in the title 'faux' from the French for false or fake.

If walking around the streets naked but for holographic clothes where have you hidden the holo emitters?

Tue, 2010-09-14 15:59

Ed Seedhouse

Offline

Guru

Timezone: GMT-8

Joined: 2005-12-14

Posts: 3544

Points: 643

Take a look at a printed

Take a look at a printed newspaper some time. There's only ONE piece of paper per page, and the "columns" aren't really there, it's simply an illusion of columns created by not printing a full line accross the page.
There is no printed line between the columns and no little grooves or bumps to physically define the columns. It's all just appearance.

It's how it LOOKS that define the "columns", and it's pretty much the same with columns in CSS. The problem actually only arises when you want different columns to have differently coloured backgrounds. Don't do that and you won't need to use "faux columns" at all. In any event, "faux colunms" are just as "real" as the "columns" in a newspaper.

It's visual impression that matters, not physical reality.

Ed Seedhouse

Posting Guidelines

High on a hill, in Wrangellia.

Thu, 2010-09-16 10:40

#10

Stomme poes

Offline

Elder

Timezone: GMT+2

Joined: 2008-02-04

Posts: 1854

Points: 378

Hugo

Quote:

If walking around the streets naked but for holographic clothes where have you hidden the holo emitters?

They are part of the city infrastructure, like the streetlamps and the security cameras o_O

I'm no expert, but I fake one on teh Internets

<!DOCTYPE html PUBLIC

Research 'faux columns'.

Hey duck

wow stomme, thanks so much

comatoseduck wrote: ... I

Whether or not Faux columns

We're cheaters

Not only is it fakery but the

Take a look at a printed

Hugo

New forum topics

User login

Navigation