whitespace because of <div style="clear:both"></div>

[iggnition]

Hi,

I'm using phocagallery for a project of mine and it's been working great. The only problem is that in category view all the photos are pushed down about 100px creating alot of whitespace. if i put display:none on the <div style="clear:both"></div> it goes back up and lines up nicely.

I can't find anything weird with my CSS so i was wondering if anyone else has run in to this too?

[Jan]

Hi, maybe your css has defined some margin, padding, line-height, etc. ? for divs without specifiing the class or id?

[iggnition]

Hi Jan, I do have a css reset i use:

Code: Select all

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,
legend,input,button,textarea,p,blockquote,th,td {
    margin:0;
    padding:0;
}
 
table {
    border-collapse:collapse;
    border-spacing:0;
}
 
fieldset,img {
    border:0;
}
 
address,caption,cite,code,dfn,em,th,var,optgroup {
    font-style:inherit;
    font-weight:inherit;
}
 
strong {
    font-style:inherit;
    font-weight:bold;
}
 
em {
    font-style:inherit;
    font-style:italic;
}
 
del,ins {
    text-decoration:none;
}
 
caption,th {
    text-align:left;
}
 
h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:normal;
}
 
q:before,q:after {
    content:'';
}
 
abbr,acronym {
    border:0;
    font-variant:normal;
}
 
sup {
    vertical-align:baseline;
}
 
sub {
    vertical-align:baseline;
}
 
legend {
    color:#000;
}
 
input,button,textarea,select,optgroup,option {
    font-family:inherit;
    font-size:inherit;
    font-style:inherit;
    font-weight:inherit;
}
 
/* ===============================
   Default font styles
   =========================== */
body {
    font-size:13px;
    line-height: 17px;
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
}
 
select,input,button,textarea,button{
    font-ize:99%;
    font-family: Arial, Helvetica, sans-serif;
}
 
table{
    font-size:inherit;
}
 
pre,code,kbd,samp,tt{
    font-family: monospace, "Courier New", Courier;
    line-height:100%;
}

here is an image of the problem:


The black bar is the clear:both div.

[Jan]

Hi, then just set display:none in css, etc. seems like there is conflict between it and the template.css

Jan