Yeah, it kinda sucks, but I've got some work to do for another client that
ought to last me maybe a week or so. But that other client was my bread 'n
butter. :o(
Anyway, thanks again!
Chris
On 7/26/07, Benjamin Sterling <[EMAIL PROTECTED]> wrote:
Ah.. been there before.
On 7/26/07, Christopher Jordan <[EMAIL PROTECTED]> wrote:
>
> Thanks Benjamin. I'll see if that helps. Unfortunately, that client just
> up and decided out of the blue to stop work on all projects for about a
> months time, so who knows when (if) I'll get back to it. :o(
>
> Chris
>
>
> On 7/26/07, Benjamin Sterling < [EMAIL PROTECTED]> wrote:
> >
> > Chris, with out actually seeing in action, my assumption is that you
> > have the height set to 413px and do not specify a overflow to either hidden,
> > auto or scroll and the assumption is that as some point the box is being
> > forced taller and not resizing after there is smaller inner content. I
> > would suggest taking out the paddings and adding them back in till you see
> > the issue. Sadly, IE has known box issues so, you will need to adjust your
> > math, height + paddingTop + paddingBottom, to suit.
> >
> > Hope this points you in the right direction.
> >
> > On 7/26/07, Christopher Jordan <[EMAIL PROTECTED] > wrote:
> > >
> > > Hi folks,
> > >
> > > I'm having trouble with a bit of jQuery/CSS stuff, and I'm hoping
> > > someone here could explain what the heck I'm doing wrong. I am not by any
> > > stretch a CSS guy. I do what I can to get by. Also (and I know this sticks
> > > in lots of people's craw), this only *has to* work in IE. This is an
> > > internal app for a company who does not use FF or any other browser.
> > >
> > > I've got the following in my main index file:
> > >
> > > <script src="/Include/JS/jquery.js"></script>
> > > <script>
> > > $(function(){
> > > $(".ActionSelection").bind("mouseover",function(){
> > > $(this).addClass("Underlined");
> > > $(this).addClass("ActiveLinkColor");
> > > }).bind("mouseout",function(){
> > > $(this).removeClass("Underlined");
> > > $(this).removeClass("ActiveLinkColor");
> > > }).bind("click",function(){
> > > DisplayScreen($(this).attr("method"));
> > > });
> > > });
> > > ...
> > > </script>
> > >
> > > then...
> > > <body>
> > > <div class="MainWrapper"> <!--- This creates the border and
> > > colors that we're used to on our submodals --->
> > > <div class="LeftPanel">
> > > <div class="ActionHeader">Add New</div>
> > > <div class="ActionSelection"
> > > method="displayAddCancelCode">Cancel Code</div>
> > > <div class="ActionSelection"
> > > method="displayAddCancelReason">Cancellation Reason</div>
> > > <br>
> > > <div class="ActionHeader">Edit/Delete</div>
> > > <div class="ActionSelection"
> > > method="displayEditCancelCode">Cancel Code</div>
> > > <div class="ActionSelection"
> > > method="displayEditCancelReason">Cancellation Reason</div>
> > > </div>
> > > <div class="RightPanel">
> > > <div class="StatusBar"></div>
> > > <div class="RightPanelContent"></div>
> > > </div>
> > > </div>
> > > </body>
> > >
> > >
> > > The relevant CSS is: (don't mind the #someVar# it's a ColdFusion
> > > thing. Those are evaluated to actual colors before they hit the browser)
> > > div.MainWrapper{
> > > height : 413px;
> > > width : 100%;
> > > margin : 2px 0px 0px 0px;
> > > padding : 3px;
> > > border : 3px solid
> > > #ThisMasterConsoleTableBorderColor#;
> > > background-color: #ThisMasterConsoleTableBackgroundColor#;
> > > }
> > > div.LeftPanel{
> > > float : left;
> > > border-right : 1px solid
> > > #ThisMasterConsoleTableBorderColor#;
> > > width : 150px;
> > > height : 400px;
> > > }
> > > div.RightPanel{
> > > float : right;
> > > border : 1px dashed ##A0A0A0;
> > > width : 400px;
> > > height : 400px;
> > > }
> > > div.StatusBar{
> > > color : ##A0A0A0;
> > > font-weight : bold;
> > > width : 100%;
> > > height : 15px;
> > > border-bottom : 1px dashed ##A0A0A0;
> > > text-align : right;
> > > }
> > >
> > > /* Generic Classes */
> > > .ActionHeader{
> > > font-weight : bold;
> > > color : #ThisMasterConsoleHeaderTextColor#;
> > > background-color: #ThisMasterConsoleHeaderBackgroundColor#;
> > > padding : 3px;
> > > margin-right : 3px;
> > > cursor : default;
> > > }
> > > .ActionSelection{
> > > padding-left: 5px;
> > > cursor : pointer;
> > > }
> > > .Underlined{
> > > text-decoration: underline;
> > > }
> > > .ActiveLinkColor{
> > > color: green;
> > > }
> > >
> > > Okay, so I've got a nice box with a three pixel border around it and
> > > it sits in a browser window sized just right leaving a two-pixel space
> > > between the edge of the window and the three pixel border. When I
mouseover
> > > one of the ActionSelection divs the text contained within dutifully
> > > underlines and changes color. However, the MainWrapper also seems to get
two
> > > pixels taller leaving me with a three pixel border on the top, left and
> > > right and a one pixel border on the bottom! :o( The two pixel margin
between
> > > the browser window's bottom edge and that one remaining pixel of the
bottom
> > > three pixel border however, remains unchanged.
> > >
> > > I can attach some before and after screen shots if that would help.
> > > Unfortunately, the code resides behind a firewall, and is not accessible
to
> > > the public. :o(
> > >
> > > Can anyone help me, please?
> > >
> > > Many Thanks,
> > > Chris
> > >
> > > --
> > > http://cjordan.us
> >
> >
> >
> >
> > --
> > Benjamin Sterling
> > http://www.KenzoMedia.com <http://www.kenzomedia.com/>
> > http://www.KenzoHosting.com <http://www.kenzohosting.com/>
>
>
>
>
> --
> http://cjordan.us
--
Benjamin Sterling
http://www.KenzoMedia.com
http://www.KenzoHosting.com
--
http://cjordan.us
