26 replies [Last post]
tomgreever
Offline
newbie
Chicago
Last seen: 6 years 14 weeks ago
Chicago
Joined: 2008-02-12
Posts: 9
Points: 0

I have two divs within another div and floated left. This creates two columns. However, I would like for both columns to always be the same height. How can I do this?

In the example below, it is fixed width and I've set a min-height to both columns. It works, but depending on the browser and text size the columns will not always be the same height.

What is the 'real' way to accomplish this?

#wrapper {


}

#left, #right {
padding: 15px;
border-style: solid;
border-width: 1px;
float:left;
min-height:170px;
}

#right {
width: 545px;
margin-left: 15px;

}

#left {
width:200px;
}






  • Adults
  • Students
  • Kids
  • Community 4:12
  • Celebrate the Journey
  • Creative Arts
  • School for the Arts

tomgreever
Offline
newbie
Chicago
Last seen: 6 years 14 weeks ago
Chicago
Joined: 2008-02-12
Posts: 9
Points: 0

I would also like to center

I would also like to center the #wrapper on the page. I've tried adding margin: 0 auto; but that doesn't appear to do anything...

Triumph (not verified)
Anonymous's picture
Guru

tomgreever wrote:I have two

tomgreever wrote:
I have two divs within another div and floated left. This creates two columns. However, I would like for both columns to always be the same height. How can I do this?

http://csscreator.com/node/22871
tomgreever wrote:
I would also like to center the #wrapper on the page. I've tried adding margin: 0 auto; but that doesn't appear to do anything...

http://csscreator.com/node/18218

tomgreever
Offline
newbie
Chicago
Last seen: 6 years 14 weeks ago
Chicago
Joined: 2008-02-12
Posts: 9
Points: 0

Triumph, Faux columns won't

Triumph,
Faux columns won't work here... Perhaps the word 'columns' is misleading. I need the 'boxes' to be the same size. Using a background image across the whole div (or page) will not work, especially since they have a border... and they could appear anywhere on the page. Unless I'm missing something you could point out.

And sorry I forgot to include the doctype in my example, but it does not change the centering of the div.

Here is the updated code, for clarity-sake.

Untitled Document

div#wrapper {
margin: 0 auto;
}

#left, #right {
padding: 15px;
border-style: solid;
border-width: 1px;
float:left;
min-height:170px;
}

#right {
width: 545px;
margin-left: 15px;

}

#left {
width:200px;
}

  • Adults

  • Students

  • Kids

  • Community 4:12

  • Celebrate the Journey

  • Creative Arts

  • School for the Arts
  • Triumph (not verified)
    Anonymous's picture
    Guru

    tomgreever wrote:Triumph,

    tomgreever wrote:
    Triumph,
    Faux columns won't work here... Perhaps the word 'columns' is misleading. I need the 'boxes' to be the same size. Using a background image across the whole div (or page) will not work, especially since they have a border... and they could appear anywhere on the page. Unless I'm missing something you could point out.
    Columns, boxes. Six of one, half dozen of another. If it were my responsibility, I'd use faux columns. Do what you think is best.

    tomgreever wrote:
    And sorry I forgot to include the doctype in my example, but it does not change the centering of the div.

    Actually, it is centered. It's just 100% width as it stands now. Add a width.

    tomgreever
    Offline
    newbie
    Chicago
    Last seen: 6 years 14 weeks ago
    Chicago
    Joined: 2008-02-12
    Posts: 9
    Points: 0

    Thanks, you are right about

    Thanks, you are right about the width. Once I added a width, it was centered.

    As for the boxes being the same height. I don't know what you mean. I'll use faux columns if it will work, but I don't see how it could. How could I create a background image that lets the boxes appear to have a border?

    I don't want the boxes to go down the whole page, I just want them to be the same height.

    What am I missing? you seem to think faux columns will work, can you be more specific please? Thanks...

    Triumph (not verified)
    Anonymous's picture
    Guru

    Just as a quick

    Just as a quick example:
    http://imaginekitty.com/phonyBorders/phonyBorders.html

    Shown with both columns taking turns as the highest (since there is more than one example I changed the IDs to classes).

    If you were using solid colors (or repeating images) instead of boxes then the .wrapperBottom wouldn't be necessary.

    it'll probably fall apart in IE6 and need some tweaking.

    Edit - It did require some tweaking in IE6 but I think I took care of the problem.

    Triumph (not verified)
    Anonymous's picture
    Guru

    *Hrump*

    *Hrump* Got what you want and hit the road.

    Didn't even leave $5 on the nightstand. :curse:

    tomgreever
    Offline
    newbie
    Chicago
    Last seen: 6 years 14 weeks ago
    Chicago
    Joined: 2008-02-12
    Posts: 9
    Points: 0

    I didn't leave! I was in the

    I didn't leave! I was in the kitchen making breakfast...

    I've been meaning to thank you for proving me wrong about the Faux columns. Truth is, I haven't had the time to work it into my own mark-up, but I looked at your code. Very creative.

    Trouble is, I'm working with a CMS that creates the 'boxes' for me -- I was hoping for a solution that didn't include more than the three original from my example.

    BUT-- I am planning to take your example and find a way to make it work with my site. When I do, I'll post... I'm just buried in some other stuff right now.

    Triumph (not verified)
    Anonymous's picture
    Guru

    Just bumping it up in a

    Laughing out loud Just bumping it up in a funny way.

    Didn't want you to miss it. Tongue

    Does it really have to be plain, boring boxes? With faux columns it can be anything. It's probably harder to fit faux columns into a plain layout that it is to do something fancy.

    tomgreever
    Offline
    newbie
    Chicago
    Last seen: 6 years 14 weeks ago
    Chicago
    Joined: 2008-02-12
    Posts: 9
    Points: 0

    BTW- I finally used your

    BTW- I finally used your code on my site this week. It took me awhile to get around to using it. But I as able to use it within my CMS too, which is nice.
    http://www.communitychristian.org/news -- the three boxes at the bottom of the page.

    Thanks again!!!

    Stomme poes
    Stomme poes's picture
    Offline
    Elder
    Netherlands
    Last seen: 2 years 42 weeks ago
    Netherlands
    Timezone: GMT+2
    Joined: 2008-02-04
    Posts: 1854
    Points: 378

    Sometimes, when it's always

    Sometimes, when it's always one of the boxes who has the ability to be the longest, you can do a double float wrap. I've seen this done for a three-column where the center column would get generated content of unknown length. A min-height set on it matched the height of the other two columns as they naturally were with whatever (fairly stable) content they had. The center column was the innermost float-- forcing the other two floats to grow along with it.

    Someone posted it on another forum and I've been meaning to make a demo version of it for some time now. But I'm lazy...

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

    Ken Nielsen
    Offline
    Regular
    Last seen: 6 years 7 weeks ago
    Joined: 2007-12-13
    Posts: 34
    Points: 0

    I am just sitting in the

    I am just sitting in the back row, watching and listening. Admiring the nice work.

    In working with the code example given here I am missing a "fauxBottom.gif" image. I am assuming that because I cannot see the background and the type is white, that there is a gray background element that repeats. What is its pixel size? or does that matter?

    tomgreever
    Offline
    newbie
    Chicago
    Last seen: 6 years 14 weeks ago
    Chicago
    Joined: 2008-02-12
    Posts: 9
    Points: 0

    FauxBottom does not repeat,

    FauxBottom does not repeat, it's a 1 pixel image that creates the bottom borders:
    http://imaginekitty.com/phonyBorders/fauxBottom.gif

    The other one FauxBorder, repeats only vertically and creates the vertical lines (border) around the divs.
    http://imaginekitty.com/phonyBorders/fauxBorder.gif

    Ken Nielsen
    Offline
    Regular
    Last seen: 6 years 7 weeks ago
    Joined: 2007-12-13
    Posts: 34
    Points: 0

    Love Ur Site

    I love your site. That is class.

    This stuff about the border is over my head. I thought you could just specify a border for a div and be done with it. I'm not getting the reason why to have fixed borders other than to constrain the fixed size of the div. Is that it?

    I've bookmarked your site for an example of how I would like to be making sites in the future. Nice and clean, flexible use of how many columns you want and where and when you want them by design and well within HTML capability.

    Good Work,

    Ken

    tomgreever
    Offline
    newbie
    Chicago
    Last seen: 6 years 14 weeks ago
    Chicago
    Joined: 2008-02-12
    Posts: 9
    Points: 0

    Ken, You can specify a

    Ken,
    You can specify a border for a div, but in order for multiple divs (columns) to appear to be the same height (regardless of the content), you need to use the Faux method.

    Two divs next to each other (floated) will not automatically be the same height. You can specify a height, but if the content is dynamic and changes, each div could be a slightly different height. divs will only be as tall as the content they contain, or as tall as you tell them to be.

    For example, if you look on my homepage, you'll see that the bottoms of my divs are not exact: some are one or two pixels taller than the other. I need to apply this faux method to my homepage too.
    http://communitychristian.org/

    at02
    Offline
    newbie
    Last seen: 5 years 36 weeks ago
    Joined: 2008-12-09
    Posts: 5
    Points: 0

    I don't quite get it..

    I hate to dig up an old topic but...

    I'm trying to make a similar thing happen on my own personal site, but I am not sure I follow how to do the faux column trick and what I have tried hasn't worked for me. But, it could also be because of the way my site is set up. The only examples I have seen do not include more divs or elements other than the #left and #right.

    On my site, I have a container div and inside are the two columns with divs inside them:
    (container)
    top left | top right(banner)
    menu | content
    bottom left | footer
    (/container)

    The top two are the same height and width no matter what, but I want the menu and content divs, and the bottom left and footer divs tied together (but not all four of them, if you follow...) I'm trying to code this for use in a CMS too, so the content will be dynamic for the two sides.

    Could someone offer up any clarifications as to how to do the Faux Column thing? Whenever I do it, it has absolutely no effect on my page, whatsoever.

    Thanks!

    Triumph (not verified)
    Anonymous's picture
    Guru

    at02 wrote:... Could someone

    at02 wrote:

    ... Could someone offer up any clarifications as to how to do the Faux Column thing? Whenever I do it, it has absolutely no effect on my page, whatsoever. ...

    Have you read the article at alistapart.com?

    at02
    Offline
    newbie
    Last seen: 5 years 36 weeks ago
    Joined: 2008-12-09
    Posts: 5
    Points: 0

    Yes, and when I try it it

    Yes, and when I try it it doesn't work, which is why I figured that either my site is set up in some different way that it doesn't work, or I am doing it wrong.

    I did a google on it and didn't really find much (most people either linked to it saying "here is how you do it" or copy-pasted it..) that helped me.. So I figured if I posted on here someone might be able to explain it differently. :rolleyes:

    Triumph (not verified)
    Anonymous's picture
    Guru

    Don't know what to tell you.

    Don't know what to tell you. It works just fine for me and anything I say would be a guess anyway.

    gary.turner
    gary.turner's picture
    Online
    Moderator
    Dallas
    Last seen: 6 min 2 sec ago
    Dallas
    Timezone: GMT-5
    Joined: 2004-06-25
    Posts: 9171
    Points: 3161

    Here's about the

    Here's about the simplest-minded demo around, two columns, apparent equal height. If that's not what you need, then post a link to your page or the complete source.

    cheers,

    gary

    Unplanned code results in a tangled wad of brain-cramping confusion.

    There are enough html & css demos and tutorials to be interesting. Please visit.

    at02
    Offline
    newbie
    Last seen: 5 years 36 weeks ago
    Joined: 2008-12-09
    Posts: 5
    Points: 0

    gary.turner wrote:Here's

    gary.turner wrote:

    Here's about the simplest-minded demo around, two columns, apparent equal height. If that's not what you need, then post a link to your page or the complete source.

    cheers,

    gary

    I appreciate the help. I've been playing around with it and figured that since the divs I wanted to extend were not in the same parent div that I should reconfigure the site and try it again.... no luck. In the css I have it so that the background image will repeat-y and the two columns are set to a min-height of 400 px and max height of 100%.. I suppose just copying the css would be better to show you what I mean.. But my coding is a bit problematic as it is (links wont show up in the proper color on firefox, but will in safari - which prompted me to go crazy with defining the proper colors.. still wont show up right.. the footer shows up where ever it chooses to..)

    If you want a link to see it, let me know.. but for now here's the code

    CSS:

    html body{
    	background: #000000;
    	text-align: center;
    	margin: 0px;
    	padding: 0px;
    	}
     
    #main{
    	width: 800px;
    	height: auto;
    	position: relative; 
    	top: 10px;
    	margin: 0px auto;
    	background: #000000;
    	}
     
    #main a:link, #main a:visited, #main a:hover{
    	color: white;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	}
     
    #menupad a:link, #menupad a:visited, #menupad a:hover{
    	color: white;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	}
     
    #content a:link, #content a:visited, #content a:hover{
    	color: white;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	}	
     
    #contentpad a:link, #contentpad a:visited, #contentpad a:hover{
    	color: white;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	}
     
    #footerpad a:link, #footerpad a:visited, #footerpad a:hover{
    	color: white;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	}
     
    #top{
    	width: 800px;
    	height: 217px;
    	position: top;
    	background: #000000;
    	}
     
    #topleft{
    	background: url("images/girlbigger.jpg") top left;
    	float: left;
    	width: 204px;
    	height: 217px;
    	background-color: #1a441a;
    	border: 1px solid #082208;
    	}
     
    #banner{
    	background: url("images/guybigger.jpg") top left;
    	width: 586px;
    	float: right;
    	height: 217px;
    	background-color: #14a441a;
    	border: 1pz solid #082208;
    	}
     
    #middle{
    	width: 800px;
    	height: auto;
    	background: url("images/background.png") repeat-y;
    	}
     
    #menu{
    	background: white;
    	width: 204px;
    	min-height: 400px;
    	height: 100%;
    	float: left;
    	background: #1a441a;
    	border: 1px solid #082208;
    	}
     
    #menupad{
    	padding: 10px;
    	color: #88bb88;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	text-align: left;
    	}	
     
    #body{
    	width: 586px;
    	min-height: 400px;
    	height: 100%;
    	float: right;
    	background: #1a441a;
    	border: 1px solid #082208;
    	}
     
    #contentpad{
    	padding: 10px;
    	color: #88bb88;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	text-align: left;
    	}
     
    #content a:link, #content a:visited{
    	color: white;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	}	
     
    #bottom{
    	width: 800px;
    	height: 100%;
    	background: url("../images/background.png") repeat-y;
    	border: 1px solid #082208;
    	}
     
    #bottomleft{
    	width: 204px;
    	min-height: 30px;
    	max-height: 100%;
    	float: left;
    	background: #1a441a;
    	border: 1px solid #082208;
    	}
     
    #footer{
    	width: 586px;
    	min-height: 30px;
    	max-height: 100%;
    	float: right;
    	background: #1a441a;
    	border: 1px solid #082208;
    	}
     
    #footerpad{
    	padding: 10px;
    	color: #88bb88;
    	font-family: helvetica, sans-serif;
    	font-size: 10px;
    	text-decoration: none;
    	text-align: left;
    	}
     
    .spacer{
    	width: 100%;
    	height: 10px;
    	background: #000000;
    	}

    Page:

    <!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><?php print $head_title; ?></title>
      <?php print $head; ?>
      <?php print $styles; ?>
      <?php print $scripts; ?>
     
      <link rel="stylesheet" type="text/css" href="style2.css" />
    </head>
     
    <body>
     
    <div id="main">
     
    	<div id="top">
    		<div id="topleft">
    		</div>
    		<div id="banner">
    		</div>
    	</div>
     
        <div class="spacer">
        </div>
     
     	 <div id="middle">
    	 	<div id="menu">
    			<div id="menupad">
    				<?php if ($primary_links): ?>
      				<div id="primary">
       					 <?php print theme('links', $primary_links); ?>
      				</div> <!-- /#primary -->
    				<?php endif; ?>
     
    				<?php if ($secondary_links): ?>
     					 <div id="secondary">
      					 <?php print theme('links', $secondary_links); ?>
      					 </div> <!-- /#secondary -->
    				<?php endif; ?>
    				<?php print $left ?>
    			</div>
    	 	</div>
     
        	<div id="body">
    			<div id="contentpad">
    				<?php if ($breadcrumb): ?>
    					<div id="breadcrumb">
    					<?php print $breadcrumb; ?>
    				</div>
    				<?php endif; ?>
    				<?php if ($mission): ?>
    				<div id="mission">
    					<?php print $mission; ?>
    					</div>
    				<?php endif; ?>
    				<div id="content">
    					<?php if ($title): ?><h1 class="title">
    						<?php print $title; ?>
    					</h1>
    					<?php endif; ?>
    					<?php if ($tabs): ?>
    					<div class="tabs">
    						<?php print $tabs; ?>
    					</div>
    					<?php endif; ?>
    					<?php if ($messages): print $messages; endif; ?>
    					<?php if ($help): print $help; endif; ?>
    					<?php print $content; ?>
    			</div>
          	</div>
     	 </div>
     
         <div class="spacer">
         </div>
     
         <div id="bottom">
         	<div id="bottomleft">
         	</div>
         	<div id="footer">
         		<div id="footerpad">
         			<?php print $closure ?> 
         		</div>
        	 </div>
         </div>
     
    </div>
     
    </body>
    </html>

    Triumph (not verified)
    Anonymous's picture
    Guru

    Please show your rendered

    Please show your rendered markup instead of the raw php.

    at02
    Offline
    newbie
    Last seen: 5 years 36 weeks ago
    Joined: 2008-12-09
    Posts: 5
    Points: 0

    Triumph wrote:Please show

    Triumph wrote:

    Please show your rendered markup instead of the raw php.

    Well, I just posted simply what I edit in BBedit, the PHP could be omitted really since it's just there to tell Drupal what to do.

    gary.turner
    gary.turner's picture
    Online
    Moderator
    Dallas
    Last seen: 6 min 2 sec ago
    Dallas
    Timezone: GMT-5
    Joined: 2004-06-25
    Posts: 9171
    Points: 3161

    Still, we need to see

    Still, we need to see exactly what the browser sees.

    cheers,

    gary

    Unplanned code results in a tangled wad of brain-cramping confusion.

    There are enough html & css demos and tutorials to be interesting. Please visit.

    at02
    Offline
    newbie
    Last seen: 5 years 36 weeks ago
    Joined: 2008-12-09
    Posts: 5
    Points: 0

    How's this: <!DOCTYPE html

    How's this:

    <!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>About | Beet Down</title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="shortcut icon" href="/misc/favicon.ico" type="image/x-icon" />
      <link type="text/css" rel="stylesheet" media="all" href="/modules/aggregator/aggregator.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/cck/theme/content-module.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/lightbox2/css/lightbox.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/node/node.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/poll/poll.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/system/defaults.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/system/system.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/system/system-menus.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/user/user.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/sites/all/modules/blockquote/blockquote.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/sites/all/modules/fckeditor/fckeditor.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/forum/forum.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/modules/cck/modules/fieldgroup/fieldgroup.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/sites/all/modules/advanced_forum/styles/naked/advanced_forum-structure.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/sites/all/modules/advanced_forum/styles/naked/advanced_forum.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/sites/all/modules/blockquote/blockquote-neutralise.css?r" />
    <link type="text/css" rel="stylesheet" media="all" href="/themes/ye olde irish/style2.css?r" />
      <script type="text/javascript" src="/misc/jquery.js?r"></script>
    <script type="text/javascript" src="/misc/drupal.js?r"></script>
    <script type="text/javascript" src="/modules/lightbox2/js/lightbox_video.js?r"></script>
    <script type="text/javascript" src="/modules/lightbox2/js/lightbox.js?r"></script>
    <script type="text/javascript">
    <!--//--><![CDATA[//><!--
    jQuery.extend(Drupal.settings, { "basePath": "/", "lightbox2": { "rtl": 0, "file_path": "/(\\w\\w/)sites/default/files", "default_image": "/modules/lightbox2/images/brokenimage.jpg", "border_size": "10", "font_color": "000", "box_color": "fff", "top_position": "", "overlay_opacity": "0.8", "overlay_color": "000", "resize_sequence": "0", "resize_speed": 400, "fade_in_speed": 400, "slide_down_speed": 600, "use_alt_layout": 0, "disable_resize": 0, "disable_zoom": 0, "force_show_nav": 0, "loop_items": 0, "node_link_text": "View Image Details", "node_link_target": false, "image_count": "Image !current of !total", "page_count": "Page !current of !total", "lite_press_x_close": "press \x3ca href=\"#\" onclick=\"hideLightbox(); return FALSE;\"\x3e\x3ckbd\x3ex\x3c/kbd\x3e\x3c/a\x3e to close", "display_image_size": "", "image_node_sizes": "()", "trigger_lightbox_classes": "", "trigger_lightbox_group_classes": "", "trigger_slideshow_classes": "", "trigger_lightframe_classes": "", "trigger_lightframe_group_classes": "", "custom_class_handler": 0, "custom_trigger_classes": "", "disable_for_gallery_lists": true, "disable_for_acidfree_gallery_lists": true, "enable_acidfree_videos": true, "slideshow_interval": 5000, "slideshow_automatic_exit": true, "show_play_pause": true, "pause_on_next_click": false, "pause_on_previous_click": true, "loop_slides": false, "iframe_width": 600, "iframe_height": 400, "iframe_border": 1, "enable_video": 1 } });
    //--><!]]>
    </script>
     
    </head>
     
    <body>
     
    <div id="main">
     
    	<div id="top">
    		<div id="topleft">
    		</div>
    		<div id="banner">
    		</div>
    	</div>
     
        <div class="spacer">
        </div>
     
     	 <div id="middle">
    	 	<div id="menu">
    			<div id="menupad">
    				  				<div id="primary">
       					 <ul class="links"><li class="menu-180 first"><a href="/news" title="News">News</a></li>
    <li class="menu-181 active-trail active"><a href="/about" title="About" class="active">About</a></li>
    <li class="menu-217"><a href="/media" title="Media">Media</a></li>
    <li class="menu-115 last"><a href="/contact" title="">Contact</a></li>
    </ul>  				</div> <!-- /#primary -->
     
    								<div id="block-menu-primary-links" class="block block-menu">
      <h2>[ Navigation ]</h2>
     
      <div class="content">
        <ul class="menu"><li class="leaf first"><a href="/news" title="News">News</a></li>
    <li class="leaf active-trail"><a href="/about" title="About" class="active">About</a></li>
    <li class="collapsed"><a href="/media" title="Media">Media</a></li>
    <li class="leaf last"><a href="/contact" title="">Contact</a></li>
    </ul>  </div>
    </div>
    <div id="block-user-0" class="block block-user">
      <h2>User Login</h2>
     
      <div class="content">
        <form action="/about?destination=node%2F2"  accept-charset="UTF-8" method="post" id="user-login-form">
    <div><div class="form-item" id="edit-name-wrapper">
     <label for="edit-name">Username: <span class="form-required" title="This field is required.">*</span></label>
     <input type="text" maxlength="60" name="name" id="edit-name" size="15" value="" class="form-text required" />
    </div>
    <div class="form-item" id="edit-pass-wrapper">
     <label for="edit-pass">Password: <span class="form-required" title="This field is required.">*</span></label>
     <input type="password" name="pass" id="edit-pass"  maxlength="60"  size="15"  class="form-text required" />
    </div>
    <input type="submit" name="op" id="edit-submit" value="Log in"  class="form-submit" />
    <div class="item-list"><ul><li class="first"><a href="/user/register" title="Create a new user account.">Create new account</a></li>
    <li class="last"><a href="/user/password" title="Request new password via e-mail.">Request new password</a></li>
    </ul></div><input type="hidden" name="form_build_id" id="form-0b81dbaf74ade9095b72084d6ebc6e20" value="form-0b81dbaf74ade9095b72084d6ebc6e20"  />
    <input type="hidden" name="form_id" id="edit-user-login-block" value="user_login_block"  />
     
    </div></form>
      </div>
    </div>
    			</div>
    	 	</div>
     
        	<div id="body">
    			<div id="contentpad">
    									<div id="breadcrumb">
    					<div class="breadcrumb"><a href="/">Home</a></div>				</div>
    												<div id="content">
    					<h1 class="title">
    						About					</h1>
    																									<div id="node-2" class="node clear-block">
     
     
     
      <div class="meta">
     
        </div>
     
      <div class="content">
        <p>Here's where the about me page will go.</p>
      </div>
     
      </div>			</div>
          	</div>
     	 </div>
     
         <div class="spacer">
         </div>
     
         <div id="bottom">
         	<div id="bottomleft">
         	</div>
         	<div id="footer">
         		<div id="footerpad">
     
         		</div>
        	 </div>
         </div>
     
    </div>
     
    </body>
    </html>

    Stomme poes
    Stomme poes's picture
    Offline
    Elder
    Netherlands
    Last seen: 2 years 42 weeks ago
    Netherlands
    Timezone: GMT+2
    Joined: 2008-02-04
    Posts: 1854
    Points: 378

    That's a lot of GET

    That's a lot of GET requests. May the force be with your server.

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