Проверял предыдущие сообщения, но все еще не смог найти проблему - ранее было 3 div, все плавали влево и выровнялись отлично после факторинга в границах/отступов/полей.
Теперь я пытаюсь сделать простое изменение макета (2 divs/float слева - бок о бок), но не может заставить второй div выравниваться рядом с первым, не уверен, что случилось. Проверено на пропущенные закрывающие теги и т.д., Но не вижу ничего, что могло бы вызвать это.
Благодарим за любую идею! HTML, CSS и JS для того, что сейчас является нерабочим калькулятором, приведены ниже, но не уверены, что они будут отображаться правильно.
HTML
<h2>What is General Services?</h2>
<div class="d1gs">
The District 1 Committee of Alcoholics Anonymous is a service body for the groups in
District 1. It is comprised of the groups' General Service Representatives (GSR's),
District ...
</div>
<br>
<div class="d1gs">
Its primary purpose is to provide a forum for sharing collective 12th Step experience
how best to carry the AA message in the Pinellas County area. The District also has
responsibility ...
</div>
<br>
<div class="d1gs">
District 1 is supported by the voluntary contributions of the groups it serves. The
District One Committee structure borrows much from "The AA Service Manual and Twelve
Concepts ...
</div>
<br>
<!-- begin.column2 -->
<div id="column2">
<div id="center"><strong>Sobriety Calculator</strong></div>
<em><small>
Every alcoholic who has been graced with the gift of sobriety is a miracle
please use the calculator below to find out how long you've enjoyed your new found
freedom…
</small></em>
<div class="center" style="height: 5px;"><small><strong>RIGHT DOWN TO THE SECOND!
</strong></small></div>
<form id="live" class="center" name="live">
<small>Sober Date: (i.e. <span style="font-style: italic;">May 28, 1995</span>)</small>
<input type="text" name="age" size="18" />
<input onclick="sobertimer(this.form)" type="button" name="start" value="Click Here" />
<input type="reset" name="resetb" value="Reset" />
<label><small>Sober Days</small> </label> <br><input type="text" name="time3" size="12" />
<label><small>Sober Hours</small> </label> <br><input type="text" name="time2" size="12" />
<label><small>Sober Minutes</small></label> <br><input type="text" name="time1" size="12" />
<label><small><em><strong>SOBER HEARTBEATS!</strong></em></small></label><br>
<input type="text" name="time4" size="12" />
</form>
</div>
<!-- end .column2 -->
CSS
/* What is District 1 General Services?
-------------------------------------------------------------- */
.d1gs {
font-family: 'Georgia', 'Times New Roman', Times, serif;
font-size: 14px;
float: left;
width: 55%;
margin-bottom: 1.5%;
margin-top: .5%;
margin-left: .35%;
padding: 1% 0 1% 2%;
}
/* Sobriety Calculator
-------------------------------------------------------------- */
#column2 {
font-family: 'Georgia', 'Times New Roman', Times, serif;
font-size: 13px;
line-height: .5em;
font: 80%/1.4 Verdana, Arial, Helvetica, sans-serif;
float: left;
width: 30%;
margin-bottom: 1.5%;
margin-left: .35%;
padding: .5%;
height: 100%;
background-color: rgba(255,255,255,.3);
border-style: inset;
border-width: 3px;
border-color: #B2B200;
}
Javascript
<script type="mce-text/javascript">// <![CDATA[
function sobertimer() {
today = new Date(); SoberDay = new
Date(document.live.age.value); timeold = (today.getTime() - SoberDay.getTime());
sectimeold = timeold / 1000; secondsold = Math.floor(sectimeold); msPerDay =
24 * 60 * 60 * 1000; timeold = (today.getTime() - SoberDay.getTime());
e_daysold = timeold / msPerDay; daysold = Math.floor(e_daysold); e_hrsold =
(e_daysold - daysold) * 24; hrsold = Math.floor(e_hrsold); minsold =
Math.floor((e_hrsold - hrsold) * 60); document.live.time4.value = secondsold;
document.live.time3.value = daysold; document.live.time2.value = hrsold;
document.live.time1.value = minsold; timerID = setTimeout("sobertimer()", 1000);
}
// ]]></script>
Если теперь я понимаю, что вам нужны два столбца... поэтому сделайте это вложение трех начальных divs в <div id="column1>"
и сделайте его плавающим влево с фиксированной шириной. Затем сделайте свой column2
плавающей точкой вправо с шириной ресивера.
* Позаботьтесь о ширине с отступом, краем и границей.
Смотрите этот скрипт и скажите мне, что вы хотите http://jsfiddle.net/pGSAR/6/