...

View Full Version : 1px space between divs



davkaplan
01-10-2008, 01:05 PM
Hi

I am having problem in that the browser is displaying empty divs.

I have attached a screenshot of the issue and the related html/css extracts.

Surely if a container is empty it collapses fully and therefore if it's parent container is also empty it should collapse as well?

There seems to be 1px of the container drawn, meaning that the borders in .fromQuestion are being drawn.

Any help would grealty be appreciated! :)

jcdevelopment
01-10-2008, 02:46 PM
try this




* {
margin:0px;
padding:0px;
}



See if that helps, i didnt see it in your code!

effpeetee
01-10-2008, 08:23 PM
davkaplan

There is an icon on the posting page to include the code '#' , css and html. It is easier to cut and paste for you and for us. Also you do not show a doctype which is essential.

If you include ALL the code we are able to easily put it in our editor and try it out.

Frank

davkaplan
01-11-2008, 09:20 AM
Hi

Thanks for the help. I tried the margin:0;padding:0; as suggested with no luck.

The HTML is generated by an aspx page and it's quite large, that's why I've only pasted the relevant section.

Bug seems to happen in both IE and FF.

DocType:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

HTML:



<div id="ctl00_ContentPlaceHolder1_fe_c2_c5_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c5_self" process="ignore">
<div class="V2ajaxSpinner">
<img id="ctl00_ContentPlaceHolder1_fe_c2_c5_spin" style="visibility: hidden;" src="/ACWP_DEV_STAGING/App_Themes/Demo/images/processingSpinner.gif"/>
</div>
<div class="labelDiv">* What percentage of your work is down to your core trade? </div>
<div class="controlDiv">
<input id="ctl00_ContentPlaceHolder1_fe_c2_c5" type="text" value="100.00" onfocus="brokerSpecificOnFocus('ctl00_ContentPlaceHolder1_fe_c2_c5_Container','ctl00_ContentPlaceHolder1_fe_c 2_c5'); clickOnFocus('71260593_Question_131745', this); showPopupText(this, 'popupDivID','This is the percentage of work carried out on your main trade, e.g. if you are a carpenter and a plumber and the % of contracts carried out as a carpenter is 75% and the plumbing aspect is 25%, enter 75%. If this trade fully describes all of your activites, please ensure that this question is answered as 100%.');" onblur="brokerSpecificOnBlur('ctl00_ContentPlaceHolder1_fe_c2_c5_Container','ctl00_ContentPlaceHolder1_fe_c2 _c5'); userAction('71260593_Question_131745','ctl00_ContentPlaceHolder1_fe_c2_c5_spin', this); removePopupText('popupDivID');" name="ctl00$ContentPlaceHolder1$fe$c2$c5"/>
</div>
<div class="V2popupIcon">
<img src="/ACWP_DEV_STAGING/App_Themes/Demo/images\questionMark.png" onmouseover=" showPopupText(this, 'popupDivID','This is the percentage of work carried out on your main trade, e.g. if you are a carpenter and a plumber and the % of contracts carried out as a carpenter is 75% and the plumbing aspect is 25%, enter 75%. If this trade fully describes all of your activites, please ensure that this question is answered as 100%.');" onmouseout=" removePopupText('popupDivID');"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c5_validators" class="validatorDiv">
<span id="ctl00_ContentPlaceHolder1_fe_c2_c5requiredFieldValidator" class="V2validator" style="color: Red; display: none;">Required</span>
<span id="ctl00_ContentPlaceHolder1_fe_c2_c5currencyFormatValidator" class="V2validator" style="color: Red; display: none;">Invalid currency</span>
</div>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c5_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c6_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c6_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c6_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c7_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c7_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c7_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c8_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c8_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c8_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c9_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c9_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c9_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c10_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c10_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c10_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c11_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c11_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c11_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c12_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c12_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c12_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c13_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c13_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c13_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c14_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c14_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c14_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c15_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c15_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c15_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c16_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c16_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c16_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c17_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c17_self" class="followingQuestion" process="ignore"/>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c17_children"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c18_Container" class="formQuestion" process="Add">
<div id="ctl00_ContentPlaceHolder1_fe_c2_c18_self" process="ignore">
<div class="V2ajaxSpinner">
<img id="ctl00_ContentPlaceHolder1_fe_c2_c18_spin" style="visibility: hidden;" src="/ACWP_DEV_STAGING/App_Themes/Demo/images/processingSpinner.gif"/>
</div>
<div class="labelDiv"> Business Description</div>
<div class="controlDiv">
<input id="ctl00_ContentPlaceHolder1_fe_c2_c18" type="text" value="Bricklayers" onfocus="brokerSpecificOnFocus('ctl00_ContentPlaceHolder1_fe_c2_c18_Container','ctl00_ContentPlaceHolder1_fe_ c2_c18'); showPopupText(this, 'popupDivID','The description of your business.');" onblur="brokerSpecificOnBlur('ctl00_ContentPlaceHolder1_fe_c2_c18_Container','ctl00_ContentPlaceHolder1_fe_c 2_c18'); removePopupText('popupDivID');" name="ctl00$ContentPlaceHolder1$fe$c2$c18"/>
</div>
<div class="V2popupIcon">
<img src="/ACWP_DEV_STAGING/App_Themes/Demo/images\questionMark.png" onmouseover=" showPopupText(this, 'popupDivID','The description of your business.');" onmouseout=" removePopupText('popupDivID');"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c18_validators" class="validatorDiv"/>
</div>
<div id="ctl00_ContentPlaceHolder1_fe_c2_c18_children"/>
</div>


CSS:




/*CSS for layout of groups and question rows*/
.feTitleDiv
{
width:100%;
font-size: 2.5em;
border-bottom: 3px solid black;
}

.V2ButtonDiv
{
width:100%;
clear:both;
}
.groupTitleDiv
{
width:100%;
background:transparent;
font-size: 1.5em;
font-weight:bold;
color:#113388;
margin-left:-1px;

border-color:#E0E6EC;
border-style:solid;
border-width:0pt 1px;
}
.groupCollapse
{
margin-top:0.3em;
margin-bottom:0.2em;
width:5%;
float:left;
margin-left:1em;
}
.groupCollapse img
{
}
.groupAjaxSpinner
{
margin-top:0.25em;
width:5%;
float:left;
}
.groupAjaxSpinner img
{
vertical-align:middle;
text-align:center;
height:16px;
width:16px;
}
.groupTitleText
{
padding:0.5em 0;
width:66%;
color:#3D75AC;
padding:0pt 0pt 0.3em;
}
.groupTitleControl
{
margin-top:0.25em;
width:20%;
float:right;
}
.groupTitleControl input[type='button']
{
background-color:#850512;
color:#FFF;
}
.formEngine
{
/*The form engine div has a style position:relative hard coded, this is required for functionality*/
font-size:1.1em;
font-family:Verdana,Arial,Serif;
width:100%;
}
.formEngineGroup
{
width:100%;
width:100%;
background:#F5FAFE url(http://i.l.cnn.net/cnn/.element/img/2.0/mosaic/base_skins/UGC/ugc_TR_bg.gif) repeat-x scroll 100% 0pt;
margin-top:1em;
}

.formQuestion
{
background-color:#FFFFFF;
border-left:0.1em solid #E0E6EC;
border-right:0.1em solid #E0E6EC;
border-top:0.1em solid #E0E6EC;
margin-left:-1px;
width:100%;


}
.followingQuestion
{
display:none;

}
.hiddenDiv
{
display:none;
}
/*css to hide floating children of floating divs*/
.followingQuestion div
{
display:none;
}
.hiddenDiv div
{
display:none;
}
/*end layout of groups and question rows*/

/*layout of individual questions*/
.labelDiv
{
float:left;
width:40%;
padding-top:0.8em;
}
.labelDivLong
{
width:86%;
float:left;

padding-top:1em;
}
.controlDiv
{
position:relative;
float:left;
width:43%;
}
.controlDiv input[type='checkbox']
{
float:right;
margin-right:3%;
}
.controlDiv input[type='text']
{
background:transparent url(../Images/v2/input200.gif) no-repeat scroll 0% 50%;
border:medium none;
height:23px;
padding:6px 10px 0px 6px;
width:91%;
}


.controlDiv select
{
background:transparent url(../Images/v2/input200.gif) no-repeat scroll 0% 50%;
border:medium none;
height:23px;
padding:2px 12px 4px 5px;
width:98%;
}
.controlDiv input[type='button']
{
background-color:#850512;
color:#FFF;
width:40%;
float:right;
}
.controlDivLong
{
margin-bottom:0.8em;
margin-top:0.8em;
position:relative;
margin-left:5%;
width:86.5%;
}
.controlDivLong select
{

width:100%;
}
.scrolly
{
margin-left:5%;
float:left;
width:81%;
max-height:120px;
overflow:auto;
line-height:2em;
}
.validatorDiv
{
clear:both;
font-size:0.01em;
margin-left:-10000px;
}
.V2validator
{
margin-left:5%;

}
.V2ajaxSpinner
{
float:left;
width:8%;
height:40px;
}
.V2ajaxSpinner img
{
padding-top:0.4em;
vertical-align:middle;
margin-left:10%;
text-align:center;
}
.V2popupIcon
{
float:left;
width:5%;
}
.V2popupIcon img
{
margin-top:2px;
margin-left:-5px;

}
/*-----------------------postcode lookup styles-----------------------*/
.postcodeLookupDiv
{
margin-top:0.5em;
margin-left:5%;
width:86%;
float:left;
clear:both;
margin-bottom:0.7em;
}
.postcodeLookupDiv input[type='button']
{
float:right;
background-color:transparent;
color:#FFF;
background-image:url(../Images/v2/postcode.png);
border:none;
background-repeat: no-repeat;
width:110px;
height:25px;
}
.postcodeLookupResults
{
clear:both;
background-color:white;
width:100%;
margin-top:0.5em;
}
.postcodeLookupResults a
{
list-style-image:url(../Images/ico_arrow.gif);
margin-left:1em;
}
/*-----------------vehicle lookup styles---------------------*/
.vehicleDescriptionDiv
{
float:left;
width:91%;
margin-left:5%;
}
.vehicleLookupDiv
{
margin-left:5%;
float:left;
width:81%;
}
.vehicleResultContainer
{
max-height: 300px;
overflow:auto;
clear:both;
border:solid 1px black;
}
.vehicleResultsContainer a
{
list-style-image:url(../Images/ico_arrow.gif);
margin-left:1em;
}
.vehicleLookupDiv select
{
clear:both;
float:right;
width:40%;
}
.vehicleLookupDiv input[type='text']
{
clear:both;
float:right;
width:40%;
}
.vehicleLookupDiv input[type='button']
{
clear:both;
float:right;
background-color:#850512;
color:#FFF;
}
/*-------------------validation styles---------------------------*/
.answerInvalid
{
background:#F7E1E0 url(../Images/v2/cross.png) no-repeat scroll 99% 50%;
}
.answerInvalid labelDiv
{
font-weight:bold;
}
.answerValid
{
background:#E6EFEA url(../Images/v2/tick.png) no-repeat scroll 99% 50%;
}
.answerValid labelDiv
{
font-weight:normal;
}
/*-------------------popup text---------------------------*/
.popupText
{
left:105%;
width:25%;
border:solid 1px #850512;
position:absolute;
}

davkaplan
01-14-2008, 10:41 AM
I'm still desparately trying to resolve this.

Any ideas?

Thanks,
David



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum