Как уменьшить размер div?

Question

[llegoo]

Здравствуйте! Мне нужно что бы элемент на сайте по ширине бы меньше 292 пикселей. Вроде бы сделал ячейку таблицы нужного размера, а элемент все равно выходит за границу. В чем может причина?

<table width="275" height="145" border="0" cellpadding="1" cellspacing="1">
    <tbody>
        <tr>
            <td valign="bottom "  background="http://uprvet-sk.ru/ai_fill/4444.jpg" style="vertical-align: top;" >
	
		<script type="text/javascript" src="http://yandex.st/jquery/2.0.3/jquery.min.js"></script>
<!-- HelloTimer http://hello-site.ru/timer/ -->
<script type="text/javascript">function get_timer_235(string_235) {var date_new_235 = string_235; var date_t_235 = new Date(date_new_235);var date_235 = new Date();var timer_235 = date_t_235 - date_235;if(date_t_235 > date_235) {var day_235 = parseInt(timer_235/(60*60*1000*24));if(day_235 < 10) {day_235 = "0" + day_235;}day_235 = day_235.toString();var hour_235 = parseInt(timer_235/(60*60*1000))%24;if(hour_235 < 10) {hour_235 = "0" + hour_235;}hour_235 = hour_235.toString();var min_235 = parseInt(timer_235/(1000*60))%60;if(min_235 < 10) {min_235 = "0" + min_235;}min_235 = min_235.toString();var sec_235 = parseInt(timer_235/1000)%60;if(sec_235 < 10) {sec_235 = "0" + sec_235;}sec_235 = sec_235.toString(); timethis_235 = day_235 + " : " + hour_235 + " : " + min_235 + " : " + sec_235;$(".timerhello_235 p.result .result-day").text(day_235);$(".timerhello_235 p.result .result-hour").text(hour_235);$(".timerhello_235 p.result .result-minute").text(min_235);$(".timerhello_235 p.result .result-second").text(sec_235);}else {$(".timerhello_235 p.result .result-day").text("00");$(".timerhello_235 p.result .result-hour").text("00");$(".timerhello_235 p.result .result-minute").text("00");$(".timerhello_235 p.result .result-second").text("00");} }function getfrominputs_235(){string_235 = "05/09/2015 00:00"; get_timer_235(string_235);setInterval(function(){get_timer_235(string_235);},1000);}$(document).ready(function(){ getfrominputs_235();});</script>
<style type="text/css">/*второй*/.second-my{width: 260px;padding: 20px;text-align: center;}.second-my .result span.items{padding: 10px 7px;display: inline-block;margin: 0 4px 0 -5px;font-size: 20px;-webkit-border-radius:4px;-moz-border-radius: 4px; border-radius: 4px;-webkit-box-shadow: 0px 1px 1px 0px rgb(178, 176, 176);-moz-box-shadow: 0px 1px 1px 0px rgb(178, 176, 176);box-shadow: 0px 1px 1px 0px rgb(178, 176, 176);background: rgb(125,126,125); /* Old browsers */background: -moz-linear-gradient(top, rgba(125,126,125,1) 0%, rgba(14,14,14,1) 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(14,14,14,1))); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(125,126,125,1) 0%,rgba(14,14,14,1) 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#7d7e7d", endColorstr="#0e0e0e",GradientType=0 ); /* IE6-9 */color: white; font-family: "Russo One", sans-serif;min-width: 30px;letter-spacing: 2px;}.second-my .result span.dot{ margin: 0 -1px;position: relative;left: -4px;font-family: "Russo One", sans-serif;font-size: 17px;}.second-my .result {float: right;}.second-my .titles{position: relative;height: 0;right: -23px;width: 292px;}.second-my .titles span{font-size: 10px;position: relative;top: 12px;}.second-my .titles span.mm{right: 18px;}.second-my .titles span.hh{right: 40px; }.second-my .titles span.dd{right: 62px;}.second-my p.titloftimer{ font-size: 18px;margin: 0 auto;left: 10px;  position: relative; font-family: "Russo One", sans-serif;}/*ресет*/.timerhello span{margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline; }.timerhello p{font-size: 100%;font: inherit;color: #191919;font-family: Verdana, sans-serif; font-size: 13px;margin: 0 0 10px 0;line-height: 17px;}.clearf{visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0; }p.hellotimercopy{display:none!important;} </style>
<div class="second-my timerhello timerhello_235">
					<div class="second-my-content"> 
						<link href="http://fonts.googleapis.com/css?family=Russo+One&amp;subset=latin,cyrillic" rel="stylesheet" type="text/css">
						<p class="titloftimer" style="color: rgb(0, 0, 0);">До дня победы осталось</p> 
						<br>
						<p class="result">
							<span class="result-day items" style="color: rgb(189, 113, 21);">49</span>
							<span class="dot" style="color: rgb(189, 113, 21);">дн.&nbsp;</span>
							<span class="result-hour items" style="color: rgb(189, 113, 21);">13</span>  
							<span class="dot" style="color: rgb(189, 113, 21);">:</span>
							<span class="result-minute items" style="color: rgb(189, 113, 21);">13</span>
							<span class="dot" style="color: rgb(189, 113, 21);">:</span>
							<span class="result-second items" style="color: rgb(189, 113, 21);">22</span> 
						</p> 
						<div class="clearf"></div>
					</div>
				</div>
<p class="hellotimercopy"><a href="http://hello-site.ru">Hello-Site.ru. Бесплатный конструктор сайтов.</a></p>

		</td>
        </tr>
    </tbody>
</table>
<p>&nbsp;</p>
<p>&nbsp;</p>

Answer 1

[titronium]

padding: 20px; - попробуйте с ним поиграться

Comments

[llegoo]

Большое спасибо, помогло

Answer 2

[ingenerdsm]

Обернул вашу таблицу в div с классом например wrapper, а затем указал следующее:
.wrapper td {max-width:292px;}
Всё получилось, но от этого пострадал background, обрезался справа.