Responsive Photos 01

Trying to figure out how to tame the height of tall pictures responsively

by Marcus

HTML

<body>

  <!-- TLD_COVER BEGIN -->
  <div id="tld_cover" class="content_section Portfolio_cover_section color_style_c_1">

    <div class="Portfolio_cover_spacer"></div>

    <!-- TLD LOGO BEGIN -->
    <div class="small_section intro_frame_a_feature">
      <img src="http://optiqvision.x10host.com/Photos/svg/TLD_Full_Color.svg" id="tld_main_pic" class="full_section Portfolio_logo_frame photo_placer">

      <ul class="tools_used_list">
        <li><strong>TOOLS USED</strong></li>
        <br />
        <li>Adobe Illustrator</li>
      </ul>

    </div>
    <!-- TLD_LOGO END -->



    <!-- LARGE_SECTION BEGIN -->
    <div class="large_section intro_frame_a_content font_roboto">

      <!-- TITLE -->
      <div class="full_section Portfolio_cover_title font_oswald">
        TLD SOFTWARE .LLC
      </div>


      <!-- THUMBNAILS BEGIN -->
      <div class="content_section Portfolio_cover_thumb_section">

        <div class="third_section Portfolio_cover_thumb">
          <div class="thumb_height_tamer">
            <img src="http://optiqvision.x10host.com/Photos/TLD_Software/i_pad_01.png" class="thumb photo_placer">
          </div>
        </div>

        <div class="third_section Portfolio_cover_thumb">
          <img src="http://optiqvision.x10host.com/Photos/TLD_Software/Stationary_01.png" class="thumb photo_placer">
        </div>

        <div class="third_section Portfolio_cover_thumb">
          <img src="http://optiqvision.x10host.com/Photos/TLD_Software/Business_Cards_01.png" class="thumb photo_placer">
        </div>

      </div>
      <!-- THUMBNAILS END -->



      <p>
        TLD Software is a Virtual Assistance Company that specializes in a hybrid form of manual and automated Business Solutions. They believe in benefiting from all the technologies we have at our disposal while still appreciating the need for an actual Human
        touch. Their target is Business Owners who want to save money using software for certain job tasks instead of hiring...

CSS

*{margin:0;	padding:0; overflow-x: hidden;}

body {
  width: 100%;
  height: 100%;
  background: url(http://optiqvision.x10host.com/Photos/Body_BG.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  margin: auto;
  position: relative;
  display: block;
  z-index: 1;
}







.content_section {
  width: 92%;
  height: auto;
  margin: auto;
}

.full_section {
  width: 100%;
  height: auto;
}

.large_section{
    width: 60%;
    height: auto;
}

.small_section {
  width: 36%;
}

.third_section{
    width: 33.333333333333333333333333333333%;
}

.intro_frame_a_content{
	float: right;
    margin-right: 0.25em;
    border-radius: 0.33em;
    position: relative;
    display: block;
}

.intro_frame_a_content p{
	font-size: 1.2em;
	margin-top: 1.37em;
	margin-bottom: 7.77em;
}

.intro_frame_a_feature {
  height: auto;
  float: left;
  display: block;
  margin-top: 2em;
  margin-bottom: 2em;
}

.button_normal{
  width: 22%;
  font-size: 1.3em;
	font-style: italic;
  text-align: center;
  border-radius: 0.44em;
  padding: 0.66em;
}

.thumb{
    width: 100%;
    height: auto;
    margin: auto; 
}

.font_roboto{
	font-family: 'Roboto', sans-serif;
}

.font_oswald{
	font-family: 'Oswald', sans-serif;
}







.Portfolio_cover_section {
  border-radius: 0.33em;
  margin-top: 3em;
  margin-bottom: 3em;
  display: block;
}

.Portfolio_cover_spacer {
  width: 100%;
  height: 6em;
  margin: auto;
  display: block;
}

.Portfolio_logo_frame {
  width: 98%;
  height: auto;
  margin: auto;
  display: block;
}

.Portfolio_cover_title{
	font-size: 3em;
	margin-top: 1em;
	text-align: center;
	display: block;
}

.Portfolio_cover_thumb_section{
	margin-top: 4.4em;
	margin-bottom: 6.6em;
	display: block;
}

.Portfolio_cover_thumb{
	float: left;
	display: block;
}

.Portfolio_button{
	display: block;
	margin-bottom:4.4em;
  float:right;
  margin-right: 2em;
}

.tools_used_list {
  width: 100%;
  height: auto;
 ...