SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Image getting warped when <a> tag applied

    http://s216.photobucket.com/albums/c...rped_image.jpg


    Got a problemo with this page:
    http://www.pauserefreshment.co.uk/be...imbali_M1.HTML

    Ive circled it in red & basically everytime i wrap a hyperlink around an image it gets warped which means I just canht do the whole light box effect:
    http://www.lokeshdhakar.com/projects/lightbox2/

    Code:
    <!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>
    <script type="text/javascript" src="js/prototype.js"></script>
    <script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
    <script src="js/lightbox.js" type="text/javascript"></script>
    <META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW">
    <title>Bean to cup coffee maker La Cimbali M1</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="css/print.css" rel="stylesheet" type="text/css" media="print">
    <style type="text/css" media="all">
    @import "css/product_detail.css";
    </style>
    </head>
    <body>
    <div id="pagewidth">
    <div id="header">
      <p> <a href="index.html"> Pause </a> </p>
      <ul>
        <li> <a href="whoweare.html" class="who"> who we are... </a> </li>
        <li> <a href="ourrange.html" class="our"> our range... </a> </li>
        <li> <a href="happycustomers.html" class="happy"> happy customers... </a> </li>
        <li> <a href="talktous.html" class="come"> come &amp; say hello... </a> </li>
        <li> <a href="hotel_coffee_machines.html" class="useful"> useful things...</a> </li>
        <li> <a href="office_coffee_machines.html" class="on-line"> on-line shop... </a> </li>
        <li> <a href="shop_coffee_machines.html" class="show"> show you care... </a> </li>
      </ul>
    </div>
    <div id="main">
      <div id="content">
        <div class="left">
          <h1 class="orange"><a name="Top" id="Top"></a>Introducing La Cimabali M1 espresso
            bean to cup automatic coffee maker</h1>
          <p>"Get Barista standard coffee without a Barista" Call Suzy 01924 363091 | <a href="mailto:david@pause.co.uk;hello@pause.co.uk"><strong> suzy@pause.co.uk</strong></a></p>
          <p><img class="free" src="images/model_bean/front_la_cimbali_m1.jpg" width="156" height="200" alt="Bean to cup coffee maker la Cimabali M!" />Serve up gourmet standard espresso coffee at the push of a button with the fully automatic La  Cimbali bean to cup coffee maker.
            La Cimabli M1 delivers a full coffee menu 100% fresh. Blending coffee
            beans and fresh milk theres no taste compromise.</p>
          <UL>
            <LI>Espresso</LI>
            <LI>Double Espresso</LI>
            <LI>Americano</LI>
            <LI>Cappuccino</LI>
            <LI>Caffe Latte</LI>
            <LI>Latte Macchiato</LI>
            <LI>White Coffee</LI>
          </UL>
          <p class="caption">La Chimbali M1 image gallery</p>
          <a><img class="float_image" src="images/model_bean/front_la_cimbali_1_micro.JPG" alt="La Cimbali bean to cup coffee maker" /></a><img class="float_image" src="images/model_bean/la_cimbali_panel_micro.jpg" width="100" height="81" /><img class="float_image" src="images/model_bean/la_cimbali_steam_arm_micro.jpg" /><img class="float_image" src="images/model_bean/la_cimbali_technical_micro.jpg" /><img class="float_image" src="images/model_bean/la_cimbali_technical_2_micro.jpg" /><img class="float_image" src="images/model_bean/la_cimbali_technical_3_micro.jpg" width="100" height="129" />
          <div style="clear:both"></div>
          <p><a href="ourrange.html">See more <strong>professional coffee machine </strong>choices.</a></p>
          <div style="clear:both"></div>
          <h2 class="orange2">What sort of pace can the La Cimbali handle?</h2>
          <p><img class="free" src="images/barista_bits/coffee_menu.jpg" alt="Eye catching flavour choice" /></p>
          <p> Built like a tank the M1 superautomatic bean to cup
            coffee maker can handle the rough and tumble of
            a small to medium sized cafe where the pace does
            not exceed 300 cups in one day:<p>
          <p class="performance"><strong>Performance profile of the m1 La Cimbali bean to cup coffee maker</strong> </p>
          <UL>
            <LI class="cup">200 cups  per hour</LI>
            <LI class="pot">33 500cc coffee pots per hour</LI>
            <LI class="jug">26 500cc milk jugs per hour</LI>
          </UL>
          <div style="clear:both"></div>
          <h3 class="orange2">Introducing the world of latte Art</h3>
          <p><img class="free" src="images/barista_bits/latte_art.jpg" alt="coffee machines with conscience"/>Coffee aficionados will recognise the premium
            taste the La Cimabli M1 serves up and they 
            wont get a headache from the bashing sound of tampers, the Cimabli makes no more sound than a purr. </p>
          <p>Discover Latte Art and learn how to tag coffee with
            your very own creativity, check out this <a href="http://www.youtube.com/watch?v=ZDZs__m5iAI" target="_blank">youtube video</a>.
            who knows you could be the next World Barista
            Champ in waiting.</p>
          <div style="clear:both"></div>
          <h5 class="orange2">La Cimbali M1 bean to cup coffee machine special features</h5>
          <p><img class="free" src="images/barista_bits/steam_arm.jpg" alt="professional coffee machine - Franke Flair" />Equipped with the industry famed <strong>"Cimbali’s patented Smart Boiler"</strong> technology,  you get a steam arm with more power than your local jet wash and stacks of hot water capacity (+ 30%).</p>
          <p class="performance"><strong>Special feature profile of the M1 La Cimbali bean to cup coffee maker.</strong></p>
          <UL>
            <LI class="green_tick">Automatically performs programmable wash cycles</LI>
            <LI class="green_tick">Hands free milk steaming</LI>
            <LI class="green_tick">Big hopper &amp; Boiler capacity</LI>
          </UL>
          <div style="clear:both"></div>
          <h6 class="orange2">How big is the La Cimbali M1 bean to cup coffee machine?</h6>
          <p><img class="free"  src="images/model_machine/tape_2.jpg" alt="Terry our professional coffee mechanic says Ey up" width="150" height="150"  />Another compact table top coffee machine from pause
            refreshment the La Cimbali M1 bean to cup coffee machine its no taller than an umper lumper  and definately skinnier than 
            a space hopper:</p>
          <UL>
            <LI class="arrow_up">Height 760cm</LI>
            <LI class="arrow_flat">Width 620cm</LI>
          </UL>
          <p>&nbsp;</p>
          <div style="clear:both"></div>
          <h6 class="orange2">How do I get hold of the la Cimabali M1 bean to cup coffee maker?</h6>
          <p class="type"><img class="free" src="images/delivery/van.jpg" width="150" height="150" alt="professional coffee machine delivery"/>To rent a  La Cimabli M1 bean to cup coffee machine call Suzy on <b>01924 363091 </b> eMail <a href="mailto:david@pause.co.uk;hello@pause.co.uk"><b>suzy@pause.co.uk </b></a>or if you have time fill in the form below and we'll get right back to you :-)</p>
          <div style="clear:both"></div>
          <p class="print"><a href="#Top">↑ Back to Top</a></p>
          <p class="print"><a href="#" onclick="window.print();return false;">Print friendly version</a></p>
          <form action="submitform.php" method="post" name="askusaquestion">
          <form action="submitform.php" method="post" name="askusaquestion">
            <input type="hidden" name="form" value="2" />
            <table border="0">
              <tr>
                <td>*Name</td>
                <td><input name="name" type="text" size="20" /></td>
              </tr>
              <tr>
                <td>Position</td>
                <td><input name="position" type="text" size="20" /></td>
              </tr>
              <tr>
                <td>*Company</td>
                <td><input name="company" type="text" size="20" /></td>
              </tr>
              <tr>
                <td>Address</td>
                <td><textarea name="address" cols="20" rows="2"></textarea></td>
              </tr>
              <tr>
                <td>*Postcode</td>
                <td><input name="postcode" type="text" size="20" /></td>
              </tr>
              <tr>
                <td>*Telephone</td>
                <td><input name="telephone" type="text" size="20" /></td>
              </tr>
              <tr>
                <td>*Email</td>
                <td><input name="email" type="text" size="20" /></td>
              </tr>
              <tr>
                <td>Existing customer</td>
                <td><label>
                  <input type="radio" name="existing" value="1" id="RadioGroup1_0"  />
                  Yes</label>
                  <br />
                  <label>
                  <input type="radio" name="existing" checked="checked" value="0" id="RadioGroup1_1" />
                  No</label>
                  <br />
                </td>
              </tr>
              <tr>
                <td>Customer account number</td>
                <td><input name="accountnumber" type="text" size="20" /></td>
              </tr>
              <tr>
                <td>*Nature of question</td>
                <td><select name="natureofquestion" size="0">
                    <option>please select...</option>
                    <option>Need a quote</option>
                    <option>equipment</option>
                    <option>ingredients</option>
                    <option>admin</option>
                    <option>deliveries</option>
                    <option>accounts</option>
                    <option>my account manager</option>
                    <option>customer service</option>
                    <option>other</option>
                  </select></td>
              </tr>
              <tr>
                <td>*Question </td>
                <td><textarea name="question" cols="20" rows="5"></textarea></td>
              </tr>
              <tr>
                <td>When is the best time to call you? </td>
                <td><input name="calltime" type="text" size="20" /></td>
              </tr>
            </table>
            <input type="submit" value="Send" />
          </form>
        </div>
      </div>
      <!-- Our range nav -->
      <div id="sidebar">
        <ul>
          </li>
          <li class="activeyellow"> <a href="ourrange.html"> our coffee machine range :-)<span style="dotsyellow">... </span> </a>
            <ul>
              <li> <a href="franke_evolution_coffee_machine.html"> FRANKE Evolution - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
              <li> <a href="flavia_creation_400.html"> Flavia 400 - Filter</a><span style="dotsyellow">...</span> </li>
              <li> <a href="#"> FRANKE Flair - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
              <li> <a href="cafe_coffee_machines.html"> Fresh Ground 310 - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
              <li> <a href="koro_coffee_machine.html"> Koro - Bean 2 Cup</a><span style="dotsyellow">...</span> </li>
              <li> <a href="mondo2_coffee_machine.html"> Mondo 2 - Filter</a><span style="dotsyellow">...</span> </li>
              <li> <a href="qwikbrew_coffee_machine.html"> Qwikbrew - Filter</a><span style="dotsyellow">...</span> </li>
              <li> <a href="pump_coffee_machine.html"> Therm - Filter</a><span style="dotsyellow">...</span> </li>
              <li> <a href="vision_coffee_machine.html"> Vision 400 - Instant</a><span style="dotsyellow">...</span> </li>
            </ul>
          </li>
          <li> <a href="ouringredients.html"> our ingredients<span style="dotsyellow">... </span> </a> </li>
          <li> <a href="largeorganisations.html"> large organisations<span style="dotsyellow">...</span> </a> </li>
          <li> <a href="specialoffer.html"> special offer<span style="dotsyellow">...</span> </a> </li>
          <li> <a href="pausepromise.html"> pause promise<span style="dotsyellow">...</span> </a> </li>
        </ul>
        
      </div>
    </div>
    <div id="footer">
      <ul>
        <li><a class="special" href="index.html">Home</a></li>
        <li><a class="special" href="pressreleases.html">Press</a></li>
        <li><a class="product" href="largeorganisations.html">Large Organisations</a></li>
        <li><a class="product" href="/pdf/large_organisations.pdf">Brochure</a></li>
        <li><a class="new" href="legal.html">Legal</a></li>
        <li><a class="our" href="pausepromise.html">pause promise</a></li>
        <li><a class="" href="supportingyourworld.html">Show you care</a></li>
        <li><a class="special" href="index.html">Copyright 2008 © pause</a></li>
      </ul>
    </div>
    <script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
    </script>
    <script type="text/javascript">
    _uacct = "UA-4432210-1";
    urchinTracker();
    </script>
    </body>
    </html>
    Code:
    body {
    	margin:0;
    	background:url(../images/bg-body.gif) repeat-x 0 0;
    	font:11px Arial, Courier, Helvetica, sans-serif;
    	color:#712453;
    	min-width:985px;
    	border: 0px solid #702453;
    }
    
    img {
    	border:none;
    	display:block;
    }
    a {
    	color:#702453;
    	text-decoration:underline;
    }
    a:hover {
    	text-decoration:underline;
    }
    #pagewidth {
    	width:985px;
    	margin:0 auto;
    	overflow:hidden;
    	position:relative;
    	
    }
    #header {
    	height:130px;
    	width:985px;
    	overflow:hidden;
    	
    }
    #header p {
    	margin:0;
    	position:absolute;
    	top:13px;
    	left:18px;
    }
    #header p a {
    	display:block;
    	overflow:hidden;
    	text-indent:-9999px;
    	width:207px;
    	height:103px;
    	background:url(../images/logo_go_home.gif);
    }
    
    #header .plain {
    	display:block;
    	overflow:hidden;
    	text-indent:-9999px;
    	width:207px;
    	height:103px;
    	background:url(../images/logo_athome.gif);
    	z-index:5;
    }
    
    #header ul {
    	margin:0;
    	padding:0;
    	list-style:none;
    	position:absolute;
    	top:12px;
    	left:244px;
    }
    #header ul li {
    	float:left;
    }
    #header ul li a {
    	display:block;
    	overflow:hidden;
    	text-indent:-9999px;
    	height:120px;
    	background-image:url(../images/text-topnav10.jpg);
    	background-repeat:no-repeat;
    }
    #header ul li a.who {
    	width:91px;
    	background-position:0 0;
    	margin:0 12px 0 0;
    }
    #header ul li a.our {
    	width:93px;
    	background-position:-91px 0;
    	margin:0 7px 0 0;
    }
    #header ul li a.happy {
    	width:105px;
    	background-position:-184px 0;
    	margin:0 5px 0 0;
    }
    #header ul li a.come {
    	width:103px;
    	background-position:-289px 0;
    	margin:0 9px 0 0;
    }
    #header ul li a.useful {
    	width:93px;
    	margin:0 14px 0 0;
    	background-position:-392px 0;
    }
    #header ul li a.on-line {
    	width:94px;
    	margin:0 13px 0 0;
    	background-position:-485px 0;
    }
    #header ul li a.show {
    	width:95px;
    	background-position:-579px 0;
    }
    #main {
    	width:100%;
    	overflow:hidden;
    }
    
    #zoom {
    width:0;
    padding-top:3px;
    float: left;
    }
    
    /* Image gallery */
    #content .float_image {
    float:left;
    padding-left:2%;
    }
    
    #content .caption {
    text-align:center;
    padding-bottom:5px;
    font-weight:bold;
    }
    
    /* Image gallery end */
    
    /* content 2 */
    
    #content_2 .h3 {
    padding:0px;
    font-size:1.5em;
    color: #B5B43E;
    text-decoration:none;
    }
    
    #content_2 .h32 {
    padding:0px;
    font-size:1.5em;
    color:#2B832C;
    text-decoration:none;
    }
    
    #content_2 .h2 {
    padding: 0;
    margin: 0;
    font-size:1.5em;
    text-decoration:none;
    color:#2B832C;
    }
    
    #content_2 .orange {
    padding: 0;
    margin: 0;
    font-size:2em;
    text-decoration:none;
    color:#D68126;
    }
    
    #content .orange {
    padding-top:28px;
    margin: 0;
    font-size:2em;
    text-decoration:none;
    color:#D68126;
    padding-bottom:3px;
    }
    
    #content .orange2 {
    padding-top:10px;
    padding-bottom:3px;
    margin: 0;
    font-size:2em;
    text-decoration:none;
    color:#D68126;
    }
    
    
    #content_2 .type {
    font-family:"Courier New" Courier monospace;
    }
    
    #content_2 .h1 {
    
    padding-bottom:0px;
    margin:0;
    font-size:2em;
    text-decoration:none;
    }
    #content_2 .h1footer {
    
    padding-bottom:10px;
    margin:0;
    font-size:2em;
    text-decoration:none;
    }
    #content_2 .h4footer {
    padding-bottom:10px;
    margin:0;
    font-size:2em;
    text-decoration:none;
    font-family:"Courier New" Courier monospace;
    }
    
    #content_2 .homefooter {
    padding-top:20px;
    padding-bottom:20px;
    margin:0;
    font-size:2em;
    text-decoration:none;
    font-family:"Courier New" Courier monospace;
    }
    
    #content_2 a:link {color: #622449; text-decoration: none}
    #content_2 a:visited {color: #622449; text-decoration: none}
    #content_2 a:hover {color: #D68126; text-decoration: underline; font-size: 100%;
    font-weight:900; }
    
    
    #content_2 li {   
          font-size:1.5em;  
    } 
    
    #content_2 ul .clear {
    list-style-type: none;
    font-weight:bold;
    }
    
    #content_2 a img {
    height:94px;
    width:125px;
    border:0px solid #000; 
    padding-left:20px;
    margin-bottom:120px; 
    } 
    
    #content_2 .left {
    	float:left;
    	width:75%;
    	padding:0 0 28px;
    }
    
    #content_2 .free
      {
        float:left;
    	padding-right:3px;
      }
      
     #content .productpic
      {
        float:left;
    	padding-right:3px;
      }
       
     
    #content_2 p {
    font-size:1.5em;
    margin-bottom: 15px;
    }
    
    #content_2 .imagefloatleft {
    float:left;
    padding-right:2px;
    }
    
    #content_2 .h3green {
    color:green;
    font-size:16px;
    padding-bottom:0px;
    margin-bottom:0px;
    }
    
    #content_2 .ecoarticle {
    margin-top:0px;
    padding-top:0px;
    }
      
    /* content 2 ends */
    
    
    
    #content p {
    font-size:1.5em;
    padding-right:2px;
    }
    
    #content .left {
    	float:right;
    	width:77%;
    	padding:0;
    }
    
    #content .h2 {
    padding:0px;
    font-size:15px;
    color: #B5B43E;
    }
    
    #content .hotel {
    padding:0px;
    font-size:15px;
    color: #B5B43E;
    }
    
    
    #content .h3 {
    padding:0px;
    font-size:15px;
    color: #B5B43E;
    text-decoration:none;
    }
    
    #content .type {
    font-family:"Courier New" Courier monospace;
    }
    
    
    #content .call {
    padding-top: 5px;
    }
    
    .home {
    margin-left: 5%;
    }
    
    
    #content a img {
    height:94px;
    width:125px;
    border:0px solid #000; 
    padding-left:20px;
    margin-bottom:120px; 
    } 
    
    /* disabled
    #content a:hover img { 
    width:300px; 
    height:225px; 
    } 
    */
    /* The rule below makes the effect work in IE */ 
    #zoom a:hover { 
    padding-left:0px;
    } 
    
    /* End Photo Zoom CSS */
    
    
    /* * html #content .right {
                padding:85px 0 0 28px;
    } */
    #content p {
    	margin:16px 0 0;
    }
    .image {
    	margin:0 0 0 -28px;
    }
    /*
    Regular side bar
    */
    #sidebar {
    	float:left;
    	width:225px;
    	padding:30px 0 0;
    }
    
    #sidebar .pic {
    		padding-bottom:50px;
    		padding-top:50px
    }
    
    #sidebar ul {
    	margin:0;
    	padding:0;
    	list-style:none;
    	width:225px;
    	overflow:hidden;
    }
    #sidebar ul li {
    	width:225px;
    	overflow:hidden;
    	float:left;
    	margin:4px 0 0;
    }
    #sidebar ul li a {
    	width:225px;
    	overflow:hidden;
    	display:block;
    	text-align: right;
    	font:14px "Arial", Courier New, San-serif;
    	line-height:18px;
    	color: #884970;
    }
    #sidebar ul li.activeblue a {
    	background: #702453;
    	text-decoration: none;
    	color: #6ecee4;
    }
    #sidebar ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #6ecee4;
    }
    #sidebar ul ul li.activeblue2 a {
    	text-decoration: underline;
    	color: #6ecee4;
    }
    #sidebar ul ul li a:hover {
    	text-decoration: underline;
    	color: #6ecee4;
    }
    #sidebar ul li.activeyellow a {
    	color: #fece49;
    	background: #702453;
    	text-decoration: none;
    }
    #sidebar ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #fece49;
    }
    #sidebar ul li.activeyellow2 a {
    	text-decoration: underline;
    	color: #fece49;
    }
    #sidebar ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #fece49;
    }
    #sidebar ul li.activeorange a {
    	text-decoration: none;
    	background: #702453;
    	color: #f6872d;
    }
    #sidebar ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #f6872d;
    }
    #sidebar ul li.activeorange2 a {
    	text-decoration: underline;
    	color: #6ecee4;
    }
    #sidebar ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #f6872d;
    }
    #sidebar ul li.activepink a {
    	text-decoration: none;
    	background: #702453;
    	color: #dd5762;
    }
    #sidebar ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #dd5762;
    }
    #sidebar ul li.activepink2 a {
    	text-decoration: underline;
    	color: #6ecee4;
    }
    #sidebar ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #dd5762;
    }
    .sidebar ul li a dotsblue {
    	color: #6ecee4;
    	font-weight: bold;
    }
    #sidebar ul li a em {
    	color: #fece49;
    	font-weight: bold;
    }
    #sidebar ul ul {
    	margin:0;
    	padding:6px 13px 12px 0;
    	list-style:none;
    	width:212px;
    	text-align:right;
    	line-height:18px;
    	border-top:1px solid #fff;
    	background:#f0e9ed url(file:../images/separator.gif) repeat-x 0 100%;
    }
    #sidebar ul ul li {
    	float:none;
    	width:auto;
    	margin:0;
    }
    #sidebar ul ul a {
    	text-indent:0;
    	height:auto;
    	width:auto;
    	color: #702453 !important;
    	display:inline;
    	font:12px Arial, San-serif !important;
    	background:none !important;
    }
    #sidebar ul ul a:hover {
    	text-decoration: underline;
    }
    #footer {
    	height: 30px;
    	width: 985px;
    	overflow:hidden;
    	padding: 0px 0px 0px 0px;
    	margin: 0px auto 0px auto;
    	border-top: 1px dotted #333;
    }
    
    #footer ul {
    	margin: 10px 0 0 240px;
    	padding: 0;
    }
    
    #footer ul li {
    	list-style: none;
    	float: left;
    }
    
    #footer ul li a {
    	display: block;
    	overflow:hidden;
    	font:10px;
    	line-height:18px;
    	color: #884970;
    	padding: 0px 10px 0px 10px;
    	border-right: 1px solid #aaa;
    }
    #footer ul li a:hover {
    	background: #702453;
    	text-decoration: none;
    	color: #fece49;
    }
    
    #content h2 {
    padding:0;
    margin:0;
    color:#B5B43E;
    }
    
    #content h1 {
    margin:0;
    padding-top:25px;
    }
    
    #content .h1 {
    padding-top:0px;
    padding-bottom:0px;
    margin:0px;
    }
    
    #content h3 {
    margin:0;
    padding-top:5px;
    color:#B5B43E;
    text-decoration:underline;
    }
    
    
    
    #content .cart2
      {
        display: block;
        width: 69px;
        height: 54px;
        background: url("../images/shopping_cart.jpg") no-repeat 0 0;
      }
    #content .cart2
     {
     margin-left:80%;
     margin-top:20px;
    
      }
      
    #content .cart2:hover
      { 
        background: url("../images/shopping_cart_go.jpg") no-repeat 0 0;
      } 
    
    #content a:link {color: #622449; text-decoration: none}
    #content a:visited {color: #622449; text-decoration: none}
    #content a:hover {color: #D68126; text-decoration: underline; font-size: 100%;
    font-weight:900; }
    
    #thumnails .pics li {
        float: left;
        width: 10em;
    	list-style:none;
    	padding: 2%;
    }
    
    
    #content .free
      {
        float:left;
    	padding-right:3px;
    	margin-bottom:5px;	
      }
      
      
      #content .freextra
      {
        float:right;
    	margin-right:10px;
      }
     
      
    #content li {
    font-size:1.5em;
    margin: 0;
    padding-left: 0;
    }
    
    
    #content ul li {
      margin-left: 0;
      padding: 2px 0 2px 16px;
      list-style: none;
      background: url('../images/green/tick.jpg') no-repeat top left;
    }
    
    
    #content ul {
    padding-left: 155px;
    }
    
    #content .performance {
    margin-bottom:0px;
    padding-bottom:-1px;
    }
    
    #content li.eco  {
    font-size:1.5em;
    margin: 0;
    padding: 0;
    }
    
    #content ul li.pot  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/barista_bits/coffee_pot.jpg') no-repeat top left;
    }
    
    #content ul li.arrow_up  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/barista_bits/vertical_arrow.jpg') no-repeat top left;
    }
    
    
    #content ul li.arrow_flat  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/barista_bits/horizontal_arrow.jpg') no-repeat top left;
    }
    
    
    
    #content ul li.cup  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/barista_bits/cup_saucer.jpg') no-repeat top left;
    }
    
    #content ul li.jug  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/barista_bits/milk_jug.jpg') no-repeat top left;
    }
    
    #content ul li.eco  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/recy_icon.jpg') no-repeat top left;
    }
    
    #content ul li.eco2  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/power_2.jpg') no-repeat top left;
    }
    
    #content ul li.eco3  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/low_energy.jpg') no-repeat top left;
    }
    
    #content ul li.eco4  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/fairtrade.jpg') no-repeat top left;
    }
    
    #content ul li.eco5  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/rain.jpg') no-repeat top left;
    }
    
    #content ul li.eco6  {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/organic.jpg') no-repeat top left;
    }
    
    #content ul li.eco7 {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/compass.jpg') no-repeat top left;
    }
    
    #content ul li.eco8 {
      margin: 0;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/bean.jpg') no-repeat top left;
    }
    
    #content ul li.eco9 {
      margin-left: 3px;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/terry.jpg') no-repeat top left;
    }
    
    #content ul li.eco10 {
      margin-left: 3px;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/az2.jpg') no-repeat top left;
    }
    
    #content ul li.eco11 {
    margin-left: 3px;
      padding: 7px 0 7px 30px;
      list-style: none;
      background: url('../images/green/rubbish2.jpg') no-repeat top left;
    }
    
    #content ul li.eco12 {
    margin-right: 3px;
      padding: 7px 0px 7px 30px;
      list-style: none;
      background: url('../images/green/heat13.jpg') no-repeat top left;
    }
    
    #content ul li.eco13 {
    margin-right: 3px;
      padding: 7px 0px 7px 30px;
      list-style: none;
      background: url('../images/green/chef_taste.jpg') no-repeat top left;
    }
    
    #content ul li.eco14 {
    margin-left: 3px;
      padding: 7px 0px 7px 30px;
      list-style: none;
      background: url('../images/green/chris_face2.jpg') no-repeat top left;
    }
    
    #content ul li.eco15 {
    margin-left: 3px;
      padding: 7px 0px 7px 30px;
      list-style: none;
      background: url('../images/green/david_face2.jpg') no-repeat top left;
    }
    
    
    
    .style2 {
    	color: #2B832C;
    	font-weight: bold;
    }
    
    #leftcolumn
    {
    float: left;
    width: 50%;
    margin-top: 10px;
    margin-bottom:20px;
    }
    
    #leftcolumn .watermachine 
    {
    float:left;
    margin-top:5px;
    }
    
    #leftcolumn p 
    {
    margin-top:5px;
    }
    
    #rightcolumn p 
    {
    margin-top:5px;
    }
    
    #rightcolumn
    {
    margin-left: 50%;
    border-left: 0px solid #622449;
    margin-top: 10px;
    margin-bottom:20px;
    }
    
    #rightcolumn .watermachine 
    {
    float:left;
    margin-top:5px;
    }
    
    #content .print
    {
    color:red;
    text-align:right;
    padding-right:5px;
    }
    
    #sitemap ul {
    font-size:1em;
    font-family:Arial, Helvetica, sans-serif;
    }
    
    #sitemap ul li {
    font-size:1.1em;
    font-family:Arial, Helvetica, sans-serif;
    }
    
    #sitemap h1 {
    padding-left:10px;
    }
    
    #sitemap a:link {color: #622449; text-decoration: none}
    #sitemap a:visited {color: #622449; text-decoration: none}
    #sitemap a:hover {color: #D68126; text-decoration: underline; font-size: 100%;
    font-weight:900; }
    
    /* home page */   
    #container_hp
    {
    width: 96%;
    margin: 10px auto;
    background-color: #fff;
    color: #333;
    border: 1px solid gray;
    line-height: 180%;
    max-width: 1200px; 
    min-width: 550px;
    margin:2% auto;
    }
    
    #top_hp
    {
    padding: 0em;
    border-bottom: 1px solid gray;
    font-family:Arial, Helvetica, sans-serif;
    height:190px;
    background: #FFFFFF url(../images/model_filter/office_female_window4.jpg) no-repeat right center;
    color:white;
    font-size:1.5em;
    line-height:90%;
    font-stretch:extra-expanded;
    }
    
    #top_hp .floatleft {
    float:right;
    }
    
    #top_hp h1
    {
    margin:0px;
    color:#D68126;
    padding:4px;
    color:#D68126;
    }
    
    #leftnav_hp
    {
    float: left;
    width: 28%;
    margin: 0;
    padding: 1em;
    background: white url(../images/model_filter/waiter4.jpg) no-repeat top right;
    }
    
    #leftnav_hp img
    {
    float:left;
    }
    
    #content_hp img {
    float:left;
    }
    
    #rightnav_hp
    {
    float: right;
    width: 28%;
    margin: 0;
    padding: 1em;
    background: white url(../images/model_filter/corporate_coffee3.jpg) no-repeat top right;
    }
    
    #rightnav_hp img {
    float:left;
    }
    
    
    #content_hp
    {
    margin-left: 30%;
    border-left: 1px solid gray;
    margin-right: 30%;
    border-right: 1px solid gray;
    padding: 1em;
    max-width: 36em;
    background: white url(../images/model_filter/shop_coffee2.jpg) no-repeat top right;
    }
    
    
    #footer_hp
    {
    clear: both;
    margin: 0;
    padding: .5em;
    color: #333;
    background-color: #ddd;
    border-top: 1px solid gray;
    }
    
    
    
    #content_hp .headerfont { 
    font-size:2em;
    padding:0px;
    margin:0px;
    color:#622449;
    }
    
    #leftnav_hp .headerfont
     {
    font-size:2em;
    padding:0px;
    margin:0px;
    color:#622449;
    } 
    
    #leftnav_hp .headerfont2
     {
    font-size:2em;
    padding:0px;
    margin:0px;
    color:#622449;
    background: white url(../images/model_filter/shop_coffee2.jpg) no-repeat top right;
    } 
    
    
    #rightnav_hp .headerfont {
    font-size:2em;
    padding:0px;
    margin:0px;
    color:#622449
    }
    
    
    #emailUs
    {
      display: block;
      width: 151px;
      height: 46px;
      background: url("../images/button/smiley_thumb.jpg") no-repeat 0 0;
    
    }
    
    #emailUs:hover
    { 
      background-position: 0 -23px;
      background: url("../images/button/smiley_thumb_green.jpg") no-repeat 0 0;
      }
    
    
    #emailUs span
    {
      display: none;
    }
    
    body.mp {
    	background-image: none;
    	background-color:#622449;
    	color:#FFFFFF;
    	min-width:985px;
    	}
    
    .parapump {
    font-size: 1.5em;
    color:#622449;
    font-size:1.5em;
    font-weight:bold;
    }
    
    .parapump2 {
    font-size: 1.5em;
    color:#622449;
    font-size:1.5em;
    font-weight:bold;
    background: white url(../images/model_filter/hotel_coffee3.jpg) no-repeat top right;
    }
    
    .parapump3 {
    font-size: 1.5em;
    color:#622449;
    font-size:1.5em;
    font-weight:bold;
    background: white url(../images/model_filter/shop_coffee3.jpg) no-repeat top right;
    }
    
    .parapump4 {
    font-size: 1.5em;
    color:#622449;
    font-size:1.5em;
    font-weight:bold;
    background: white url(../images/model_filter/business_coffee.jpg) no-repeat top right;
    }
    /* home page footer start */  
    
     	.nav {
        margin:auto;
        border:1px;    
        height:60px;
        background:#FFFFFF;
        font:bold 88%/1.1 verdana;
    	clear:both;
    	overflow:hidden;
    	}
    
     	.nav li {
        float:left;
        list-style:none;
    	margin:5px;
    	
    		}
    	
    	.nav li a img {	
    	margin:0 -5px;
    	border:1px inset #66f;
    	color:#ffffff
    	background:;
    		}
    
        .nav li a {
        float:left;
        padding:0 5px; 
        height:50px;
    	line-height:50px;
        color:#D68126;
        text-decoration:none;
        text-transform:none;
    	font-size:1.25em;
    }
        .nav li a:hover {
        margin:-3px;
        border:3px inset #66f;
        color:#CC6600;
        background:;
    }
    
    .paddinglogo {
    padding-left:15px;
    }
    		
    /* home page footer end */  
    /* home page ends*/   
    a:link {color: #622449; text-decoration: none}
    a:visited {color: #622449; text-decoration: none}
    a:hover {color: #D68126; text-decoration: underline; font-size: 100% }
    
    .hbloat {
    font-size:2em;
    font-weight:bold;
    color:#622449;
    }
    
    /* blocks */
    #wrap_blocks {
    width:100%; 
    clear:both;
    overflow:hidden;
    
    }
    
    #block_1{
    float:left;
    width:15%;
    background-color: ;
    border: 2px solid #702453;
    color:#622449;
    margin-right:3%;
    margin-top:3%;
    margin-left:10%;
    height:320px; 
    }
    
    #block_1 img {
    margin-left:25%;
    padding:5px; 
    }
    
    #block_1 p{
    font-size:1.5em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    }
    
    #block_1 .biglink {
    font_size:2em;
    
    }
    
    #block_2 {
    width:15%;
    float:left;
    border: 2px solid #702453;
    margin:3%;
    background-color: ;
    height:320px; 
    }
    
    #block_2 img {
    margin-left:25%;
    padding:5px;
    }
    
    #block_2 p{
    font-size:1.5em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    }
    
    #block_3 {
    width:15%;
    float:left;
    margin:3%;
    border: 2px solid #702453;
    background-color: ;
    height:320px; 
    }
    
    #block_3 p{
    font-size:1.5em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    }
    
    #block_3 img {
    margin-left:25%;
    padding:5px;
    }
    
    #block_4 {
    width:15%;
    float:left;
    margin:3%;
    border: 2px solid #702453;
    background-color: ;
    height:320px; 
    }
    
    #block_4 p{
    font-size:1.5em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    }
    
    #block_4 img {
    margin-left:25%;
    padding:5px;
    }
    
    #block_2 p{
    font-size:1.5em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    }
    
    #block_1 p{
    font-size:1.5em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2%;
    }
    
    #block_2 h1{
    font-size:2.5em;
    font-family:Arial,Verdana,Sans-serif;
    }
    
    
    /* end blocks */
    
    /*cup and text */
    
    #wrap_cupandtext {
    width:100%; 
    clear:both;
    }
    
    #cup_left {
    float:left;
    width:50%;
    background-color: #fff;
    border-top: 0px solid #702453;
    color:#622449;
    font-weight:bold;
    margin-left:-1px;
    }
    
    
    
    #cup_left img {
    display: block;
        margin-left: auto;
        margin-right: auto;
    	padding-top:0px;
    	margin-top:0px;
    			} 
    
    #cup_left h2{
    margin-left:8%;
    font-size:1.75em;
    }
    
    #cup_left .address {
    padding-left:20px;
    font-size:15px;
    padding-top:0px;
    margin-top:1px;
    }
    
    #cup_left h3{
    margin:0;
    padding-top:10px;
    padding-bottom:0px;
    margin-bottom:0px;
    font-size:25px;
    color:#D68126;
    padding-left:20px;
    }
    
    #strap_right {
    width:50%;
    float:right
    }
    
    #strap_right .endpadding {
    padding-bottom:50px;
    }
    
    #strap_right .contact {
    color:#F2CF4D;
    font-size:2em;
    margin-top:0px;
    padding-top:0px;
    }
    
    #strap_right .floatleft {
    float:left;
    }
    
    #strap_right .paddingstrip {
    padding:0px;
    padding-top:0px;
    margin-top: 0px;
    margin-bottom:0px
    margin-left:0px;
    margin-right:5px;
    }
    
    #strap_right .headerbloat {
    font-size:17px;
    background-color:#A6AE1F;
    }
    
    #strap_right .cats {
    font-size:13px;
    margin-left:-1px;
    }
    
    #strap_right .strapline {
    font-size:2em;
    padding-top:0px; 
    margin-top:0px;
    padding-bottom:0px;
    margin-bottom:0px;
    }
    
    #strap_right p{
    font-size:1.25em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2%;
    }
    
    #strap_right h1{
    font-size:3em;
    font-family:Arial,Verdana,Sans-serif;
    padding-bottom:0px;
    margin-bottom:0px;
    padding-top:0px;
    margin-top:0px;
    }
    
    .centre 
    {
    text-align:center;
    }
    
    /*cup and text ends*/
    
    
    /* blocks under cup start */
    #wrap_blocks_c {
    width:100%; 
    clear:both;
    overflow:hidden;
    }
    #block_1_c, #block_2_c, #block_3_c, #block_4_c{display:inline;}
    
    #block_1_c{
    float:left;
    width:100px;
    background-color: ;
    border: 1px solid #702453;
    color:#622449;
    margin:1%;
    height:340px; 
    } 
    
    #block_1_c img {
    padding:5px; 
    display: block;
    margin-left: auto;
    margin-right: auto; 
    }
    
    #block_1_c p{
    font-size:1em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    padding:2px;
    }
    
    #block_1_c .biglink {
    font-size:1.4em;
    text-align:center;
    }
    
    #block_2_c {
    width:100px;
    float:left;
    border: 1px solid #702453;
    margin:1%;
    background-color: ;
    height:340px; 
    }
    
    #block_2_c .biglink {
    font-size:1.4em;
    text-align:center;
    }
    
    #block_3_c .biglink {
    font-size:1.4em;
    text-align:center;
    }
    
    #block_4_c .biglink {
    font-size:1.4em;
    text-align:center;
    }
    
    #block_2_c img {
    padding:5px;
    display: block;
    margin-left: auto;
    margin-right: auto; 
    }
    
    #block_2_c p{
    font-size:1em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    padding:2px;
    }
    
    #block_3_c {
    width:100px;
    float:left;
    margin:1%;
    border: 1px solid #702453;
    background-color: ;
    height:340px; 
    }
    
    #block_3_c p{
    font-size:1em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    padding:2px;
    }
    
    #block_3_c img {
    padding:5px;
    display: block;
    margin-left: auto;
    margin-right: auto; 
    }
    
    #block_4_c {
    width:100px;
    float:left;
    margin:1%;
    border: 1px solid #702453;
    background-color: ;
    height:340px; 
    }
    
    #block_4_c p{
    font-size:1em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    padding:2px;
    }
    
    #block_4_c img {
    padding:5px;
    display: block;
    margin-left: auto;
    margin-right: auto; 
    }
    
    #block_2_c p{
    font-size:1em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2px;
    }
    
    #block_1_c p{
    font-size:1em;
    font-family:Arial,Verdana,Sans-serif;
    margin-left:2%;
    }
    
    #block_2_c h1{
    font-size:2.5em;
    font-family:Arial,Verdana,Sans-serif;
    }
    
    /* blocks under cup ends */
    
    .pause {
    color:#D68126;
    font-weight:bold;
    font-size:20px;
    }
    
    #sidebar ul li.sub a {
    	text-decoration: none;
    	background: #A6AE1F;
    	color: #622449;
    	}
    	
    #sidebar .sub a:hover {
    	text-decoration:none;
    	color: #622449;
    }	
    
    #emailUs
    {
      display: block;
      width: 100px;
      height: 66px;
      background: url("../images/testimonial/get_quote_2.jpg") no-repeat 0 0;
      margin-left:0px;
      float:left;
    }
    
    #emailUs:hover
      { 
        background: url("../images/testimonial/get_quote.jpg") no-repeat 0 0;
      }
    
    
    #emailUs span
    {
      display: none; 
    }
    
    /*quick find*/
    
    #quick, #quick ul { /* all lists */
    	padding: 0;
    	margin-left: 20px;
    	list-style: none;
    	line-height: 1;
    	font-size:15px;
    	font-family:Arial, Helvetica, sans-serif;
    	}
    
    #quick a {
    	display: block;
    	width: 15em;
    }
    
    #quick li { /* all list items */
    	float: left;
    	width: 16em; /* width needed or else Opera goes nuts */
    }
    
    #quick li ul { /* second-level lists */
    	position: absolute;
    	background: #CCCCCC;
    	width: 15em;
    	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
    }
    
    #quick li ul ul { /* third-and-above-level lists */
    	margin: -1em 0 0 10em;
    } 
    
    #quick li:hover ul, #quick li.sfhover ul {
        left: auto;
    }
    
    #quick li:hover ul ul, #quick li.sfhover ul ul {
    	left: -999em;
    }
    
    #quick li:hover ul, #quick li li:hover ul, #quick li.sfhover ul, #quick li li.sfhover ul {
        left: auto;
    }
    
    #cup_left {
    	clear: left;
    	}
    
    /* Quick find end */
    
    /* Light Box */
    #lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
    #lightbox img{ width: auto; height: auto;}
    #lightbox a img{ border: none; }
    
    #outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
    #imageContainer{ padding: 10px; }
    
    #loading{ position: absolute; top: 40%; left: 40%; height: 25%; width: 100%; text-align: center; line-height: 0; }
    #hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
    #imageContainer>#hoverNav{ left: 0;}
    #hoverNav a{ outline: none;}
    
    #prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
    #prevLink { left: 0; float: left;}
    #nextLink { right: 0; float: right;}
    #prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
    #nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }
    
    #imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }
    
    #imageData{	padding:0 10px; color: #666; }
    #imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
    #imageData #caption{ font-weight: bold;	}
    #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
    #imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	
    
    #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
    
    .strapshrink {
    font-size:14px
    }
    /* Light Box Ends*/
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com

  2. #2
    The Mind's I ® silver trophy Dark Tranquility's Avatar
    Join Date
    Sep 2003
    Location
    KSA - UAE
    Posts
    9,457
    Mentioned
    8 Post(s)
    Tagged
    1 Thread(s)
    By warped you mean a border?
    If that's it just add to your css:
    Code CSS:
    img {
            border: 0 none;
          }

  3. #3
    SitePoint Zealot huit's Avatar
    Join Date
    Nov 2009
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It looks like the way your CSS is stacked the styles are overwriting the actual width of the image (100px from the looks of your source code). The CSS that applies to it is forcing it to be 125px. You will have this issue with all of those images when you wrap them in <a> tags.

    Or, if the other images are ok, it could be that your first image does not have height and width explicitly set like the rest of them do.

    Your CSS:
    Code CSS:
    #content a img {
    height:94px;
    width:125px;
    border:0px solid #000; 
    padding-left:20px;
    margin-bottom:120px; 
    }

    Your first two images:
    Code HTML4Strict:
    <a><img class="float_image" src="images/model_bean/front_la_cimbali_1_micro.JPG" alt="La Cimbali bean to cup coffee maker" /></a>
     
    <img class="float_image" src="images/model_bean/la_cimbali_panel_micro.jpg" width="100" height="81" />

    I would have the height and width in the css only apply to the link rather than the image inside the link.

    Code CSS:
    #content a {
    height:94px;
    width:125px;
    text-align:center:
    padding-left:20px; /*is this padding to center the image? if so, it isn't needed if you use text-align */
    margin-bottom:120px; 
    } 
     
    #content a img {
    border:0px solid #000;  
    }

  4. #4
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you for your replies but I'm afraid Ive created a whole set of new issues :-(
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com

  5. #5
    The Mind's I ® silver trophy Dark Tranquility's Avatar
    Join Date
    Sep 2003
    Location
    KSA - UAE
    Posts
    9,457
    Mentioned
    8 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by Zygoma View Post
    Thank you for your replies but I'm afraid Ive created a whole set of new issues :-(
    How? can you explain so that you can get proper help?

  6. #6
    SitePoint Zealot huit's Avatar
    Join Date
    Nov 2009
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Dark Tranquility View Post
    How? can you explain so that you can get proper help?
    He's started a new thread for the new issue. I just found it while browsing.
    http://www.sitepoint.com/forums/showthread.php?t=666957

  7. #7
    SitePoint Guru Zygoma's Avatar
    Join Date
    May 2006
    Location
    York, Uk
    Posts
    916
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Problem solved & I am v sorry for splitting the post.

    I solved the problem by using this tutorial:
    http://css.maxdesign.com.au/floatuto...torial0407.htm

    And fixed the anchor text warping the sahpe of the image with this css:
    .machinegallery
    {
    float: left;
    width: 100px;
    border: 1px solid #999;
    margin: 0 30px 15px 0;
    padding: 5px;
    }

    #content .machinegallery a img{
    width: 100px;
    height:100px;
    border: none;
    margin: 0px;
    padding: 0px;
    }

    Thank you all for your help and concern, now I'm going to have a lie down :-)
    I have had a perfectly wonderful
    evening, but this wasn't it-
    Julius "GROUCHO" Marx - 1890-1977
    http://www.davidclick.com


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •