Firefox dynamic cell stretch issue [Archive]

reuber1

12-05-2006, 09:00 PM

EDIT: I forgot. Do a search for "guitar". There shouldn't be any content yet anywhere else except the homepage and Repairs, and possibly a few others that I'm not aware of.
http://64.198.195.247/?skinid=99

ARGGHHH...I just retooled my CSS and everything works great except now, if you do a search, on the search page in Firefox (old and new versions) the dividing line between each item is like 14 pixels tall, instead of 1 pixel like it should be, yet Internet Explorer (6 and 7, anyway) is working fine for some odd reason.

Here's the CSS...
http://64.198.195.247/skins/Skin_99/style.css

And here's my ORIGINAL code before it dynamically pulls in the server side material:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<%@ Control Language="c#" AutoEventWireup="false" Inherits="AspDotNetStorefront.TemplateBase" TargetSchema="http://schemas.microsoft.com/intellisense/ie5" %>
<%@ Register TagPrefix="ComponentArt" Namespace="ComponentArt.Web.UI" Assembly="ComponentArt.Web.UI" %>
<%@ Register TagPrefix="Wilson" Namespace="Wilson.WebForm" Assembly="WilsonWebForm" %>

<html lang="en">
<head>
<title>(!METATITLE!)</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta NAME="rating" CONTENT="General">
<meta NAME="distribution" CONTENT="global">
<meta NAME="robots" CONTENT="all">
<meta NAME="description" CONTENT="(!METADESCRIPTION!)">
<meta NAME="keywords" CONTENT="(!METAKEYWORDS!)">
<link rel="stylesheet" href="skins/Skin_(!SKINID!)/style.css" type="text/css">
<script type="text/javascript" src="jscripts/formValidate.js">// JavaScript for Rollover Functionality
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}
}
}
window.onload=startList;
</script>

</head>












<body>

(!COUNTRYBAR!)

<div id="wrap">

<div id="logo">
<a href="default.aspx"><img src="skins/skin_(!SKINID!)/images/logo.gif" width="195" height="100" border="0" /></a>
</div>

<div id="flash">
<img src="skins/skin_(!SKINID!)/images/flashplaceholder.jpg" class="flash" width="176" height="80px" />
</div>

<div id="login">
(!USER_INFO!)
</div>

<div id="search">
<form style="cursor:hand; margin-top: 0px; margin-bottom: 0px;" id="topsearchform" name="topsearchform" method="GET" action="search.aspx">
<input name="SearchTerm" type="text" size="15"><input value="Search" name="B1" type="submit">
</form>
</div>

<div id="navhead">
<ul id="nav">
<li id="nav-home"><a href="default.aspx">Home</a></li>
<li id="nav-news"><a href="t-news.aspx">News</a></li>
<li id="nav-locations"><a href="t-locations.aspx">Locations</a></li>
<li id="nav-specials"><a href="t-specials.aspx">Specials</a></li>
<li id="nav-repair"><a href="t-repair.aspx">Repair</a></li>
<li id="nav-rentals"><a href="t-rentals.aspx">Rentals</a></li>
<li id="nav-lessons"><a href="t-lessons.aspx">Lessons</a></li>
<li id="nav-staff"><a href="t-staff.aspx">Staff</a></li>
</ul>
</div>

<div id="navleft">
<ComponentArt:Menu id="VertMenu"
Orientation="vertical"
ScrollingEnabled="true"
ScrollUpLookId="VertScrollUpItemLook"
ScrollDownLookId="VertScrollDownItemLook"
CssClass="VertTopMenuGroup"
DefaultGroupCssClass="VertMenuGroup"
DefaultItemLookID="VertDefaultItemLook"
DefaultGroupItemSpacing="1"
ExpandDelay="0"
ExpandDuration="0"
ExpandSlide="None"
ExpandTransition="None"
CascadeCollapse="false"
CollapseDelay="0"
CollapseSlide="None"
CollapseTransition="None"
ImagesBaseUrl="skins/skin_1/images/"
EnableViewState="false"
Width="100%"
runat="server">
<ItemLooks>
<ComponentArt:ItemLook LookId="VertTopItemLook" CssClass="VertTopMenuItem" HoverCssClass="VertTopMenuItemHover" LabelPaddingLeft="4" LabelPaddingRight="4" LabelPaddingTop="0" LabelPaddingBottom="0" />
<ComponentArt:ItemLook LookId="VertDefaultItemLook" CssClass="VertMenuItem" HoverCssClass="VertMenuItemHover" LabelPaddingLeft="4" LabelPaddingRight="4" LabelPaddingTop="0" LabelPaddingBottom="0" />
<ComponentArt:ItemLook LookID="VertScrollUpItemLook" ImageUrl="scroll_up.gif" ImageWidth="15" ImageHeight="13" CssClass="VertScrollItem" HoverCssClass="VertScrollItemH" ActiveCssClass="VertScrollItemA" />
<ComponentArt:ItemLook LookID="VertScrollDownItemLook" ImageUrl="scroll_down.gif" ImageWidth="15" ImageHeight="13" CssClass="VertScrollItem" HoverCssClass="VertScrollItemH" ActiveCssClass="VertScrollItemA" />
</ItemLooks>
</ComponentArt:Menu>

<img src="skins/skin_(!SKINID!)/images/pmlogo.gif" align="right"/>
</div>

<div id="centercontent">
<a href="default.aspx">Rieman Music:</a> (!SECTION_TITLE!)
<p><asp:placeholder id="PageContent" runat="server"></asp:placeholder></p>
</div>

<div id="footer">
<a href="t-privacy.aspx">Privacy Policy</a>         <a href="t-returns.aspx">Return Policy</a>         <a href="default.aspx">Home</a>         <a href="t-contact.aspx">Contact Us</a>
</div>
</div>

</body>
</html>

This is what I'm talking about, Willis:

http://i4.photobucket.com/albums/y126/reuber1/pic.jpg

Ryan8720

12-06-2006, 03:21 AM

None of the pages have any content so it's hard to diagnose. I'm not sure where you took the screenshots from.

reuber1

12-06-2006, 01:59 PM

I forgot. Do a search for "guitar". There shouldn't be any content yet anywhere else.

Drazan

12-06-2006, 02:09 PM

change the "spacer.gif" from 10px to 1px and make sure that it is transparent, even though you have it in the source code as a static width and height.

If that does not work put a height value for .LightCell in the css.

Didn't see if there was anything else that may have caused an issue, but I only glanced through it quickly.

reuber1

12-06-2006, 02:14 PM

change the "spacer.gif" from 10px to 1px and make sure that it is transparent, even though you have it in the source code as a static width and height.

If that does not work put a height value for .LightCell in the css.

Didn't see if there was anything else that may have caused an issue, but I only glanced through it quickly.
I'll try putting in a height for .LightCell and see if that works. Thing is, a lot of that is coming from the StoreFront, not me, so I don't know how much control over this I have (I commented in the style sheet what is mine and what is theirs...ughh). I mean, I could change their CSS around, but some of the site material is being generated through XML packages with code that only developers understand, and being that I have yet to get a response on the ASP storefront forums I don't think I'll be getting help there, but a lot of the site is also controlled by the ASPDNSF administration site, which is about as flexible as rock candy.

The odd thing is, this didn't happen with my old CSS that I posted earlier, but I can't imagine what changes I made that would cause this. I'm pretty sure I don't have an option to set the size of the spacer as that's coming from them...I mean, I could change it, but I'm not sure if the site will allow that. If it were up to me, spacer.gif would be deleted.

reuber1

12-06-2006, 02:32 PM

Just tried specifying a height in the .lightcell properties and also changing the spacer.gif to 1px instead of 10px (it was already transparent, or at least it should have been...that lightcell should just be a background color)...no luck. :confused:

Hmmm, looks like I can stretch it taller by specifying a height value greater than 13px, but it won't get any smaller than 13. Maybe it is the spacer. One step forward, ten steps backward.