Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Mar 2007
    Location
    Usa
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Firefox and IE issues *sigh*

    On my website I have a couple pages where in IE the sidebar fits nicely on the page but in Firefox, the sidebar hangs off the bottom.

    Please see attachments ...

    I would appreciate any help I can get. I have been working on this for a couple days and am drained of brain mass!!!

    Thanks
    Terri
    Attached Thumbnails Attached Thumbnails Firefox and IE issues *sigh*-firefox.png   Firefox and IE issues *sigh*-ie.png  

  • #2
    New Coder
    Join Date
    Sep 2007
    Posts
    34
    Thanks
    0
    Thanked 7 Times in 7 Posts
    weird query, how to tell without seeing the code ?
    somewhere tags getting overflow.
    u must specify "overflow:hidden" to make it proper.......dont ask where, cant tell without seeing the code


    anyway,
    gud luck....
    rams

  • #3
    New Coder
    Join Date
    Mar 2007
    Location
    Usa
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts
    you need to see the css yea?

  • #4
    New Coder
    Join Date
    Sep 2007
    Posts
    34
    Thanks
    0
    Thanked 7 Times in 7 Posts
    s ofcourse cant tell without see

    but problem is the same what i wrote in previous post

    ragards,
    rams
    Last edited by rams1703; 09-12-2007 at 07:16 AM.

  • #5
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    It looks to me like you've set a height for that bar that IE will automatically extend to fit the content, but Firefox will correctly just let the text overflow so as not to change the specific dimensions you have set.
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • #6
    New Coder
    Join Date
    Mar 2007
    Location
    Usa
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok so here is my css file.....


    Code:
    /* ********************************************************************************
     * Building blocks
     * h2, h3, p, etc        Standard html tags
     * div.gbBlock           Sidebar or content section with style for contained lists
     * ul.gbBreadCrumb       List of links/path elements
     * table.gbDataTable     Table for data/form elements with styles for shading rows
     * navigation						 Navigation 
     */
     
    #navigation {
    	background: #ffffff;
    	font: 1.7em "Trebuchet MS", "Lucida Sans Unicode", sans-serif;
    	height: 144px;
    	margin: 0 auto;
    	margin-top: 10px;
    	padding: 10 10px;
    	float: right;
    	width: 100px;
    	font-weight: normal;
    }
    
    #navigation ul {
    	margin: 0;
    	padding: 0;
    }
    
    #navigation li {
    	list-style: none;
    }
    
    #navigation li .menu3 {
    	background-image:url(images/home.gif); 
    	background-position: center left;
    	background-repeat: no-repeat; 
    }
    #navigation li .menu4 {
    	background-image:url(images/about.gif); 
    	background-position: center left;
    	background-repeat: no-repeat; 
    }
    #navigation li .menu5 {
    	background-image:url(images/links.gif); 
    	background-position: center left;
    	background-repeat: no-repeat; 
    }
    #navigation li .menu6 {
    	background-image:url(images/contact.gif); 
    	background-position: center left;
    	background-repeat: no-repeat; 
    }
    #navigation li a {
    	background: #ffffff;
    	color: #0086de;
    	display: block;
    	padding: 3px 4px 3px 20px;
    	text-decoration: none;
    	height: 11%;
    }
    
    #navigation li a:hover {
    	background: #96c430;
    	color: #ffffff;
    	background-image:url(images/hover.gif); 
    	background-position: center left;
    	background-repeat: no-repeat; 
    }
    
    #gallery h2 {
        margin: 0;
        padding: 0;
    }
    
    #gallery h3 {
    		margin: 0;
        padding: 0;
    }
    
    #gallery h4 {
    		margin: 0;
        padding: 0;
    }
    
    #gallery form {
    		margin-top: 0px;
    		margin-right: 0px;
        padding: 5px 5px 5px 5px;
    }
    
    #gallery p {
        margin: 0.6em 0;
        padding: 0;
    }
    
    .gbBlock {
    		font-size: 1.3em;
    		color: #274c78;
        padding: 0.7em;
        border-width: 0 0 0px 0;
        border-style: inherit;
        border-color: inherit;
        /* IE can't inherit these */
        border-style: expression(parentElement.currentStyle.borderStyle);
        border-color: expression(parentElement.currentStyle.borderColor);
    }
    
    .gbBlock ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }
    
    .gbBlock ul ul {
        margin: 0 0 0.5em 1.0em;
    }
    
    .gbBlock li {
        padding: 6px 0 0 0;
    }
    
    #gallery .gbBlock h3 {
        margin-bottom: 0.5em;
    }
    
    #gallery .gbBlock h4 {
        margin-top: 0.5em;
    }
    
    
    #gsNavBar div.gbBreadCrumb {
        margin: 0;
        padding: 4px 8px;
    }
    
    table.gbDataTable {
        padding-bottom: 4px;
    }
    
    table.gbDataTable th, table.gbDataTable td {
        padding: 4px;
    }
    
    
    .giBlockToggle {
        padding: 0 0.4em 0.1em;
    }
    .giBlockToggle:hover {
        cursor: pointer;
    }
    
    
    .gbMarkupBar {
        margin: 4px 0;
    }
    
    #gallery .gbMarkupBar input {
        margin: 0;
        padding: 0;
    }
    
    
    /* ********************************************************************************
     * Sections
     * body.gallery     Page body in G2 standalone (doesn't apply to embedded)
     * #gallery         Page container
     * #gsNavBar   Top bar with breadcrumb and other links
     * #gsSidebar       Sidebar
     * #gsContent       Main content
     */
    
    body.gallery {
        background: #333 url(images/back.jpg) repeat-x;
    	color: #313131;
    	font: normal 70% "Trebuchet MS", "Lucida Sans Unicode", sans-serif;
    }
    
    #gallery {
      background: #fff;
    	margin: 0 auto;
    	margin-top: 10px;
    	margin-bottom: 10px;
    	width: 780px;
    }
    
    #gallery.rtl {
        direction: rtl;
    }
    
    #gsNavBar {
      border-top-width: 0px;
      border-bottom-width: 0px;  
    }
    
    #gsNavBar div.gbSystemLinks {
        padding: 2px 4px;    
    }
    
    #gsNavBar div.gbSystemLinks span {
        padding: 0 14px;   
    }
    
    #gsSidebar {
      background: #ffffff;
    	font: 1.4em "Trebuchet MS", "Lucida Sans Unicode", sans-serif;
    	height: 144px;	
    	margin-left: 10px;
    	margin-top: 30px;
    	padding: 0 0px;
    	width: 200px;	
    }
    
    #gsSidebarCol {
        width: 1%; /* Expand to fit content ("0" bad4 firefox, "1px" bad4 opera) */
        font-size: 0.80em;   
    }
    
    #gsHeader {
    background: url(images/galleryLogo_sm.jpg) center left no-repeat;
    	height: 90px;
    	width: 400px;
    	float: left;
    	border-left: 10px solid #ffffff;
    	}
    
    #gsHeader h1 {
    	margin-left:260px;
    	margin-top:7px;
    	color: #333;
    	font-size: 1.7em;
    }	
    
    td.giAlbumCell, td.giItemCell {
        padding: 10px;    
    }
    
    #gallery td.giAlbumCell select, #gallery td.giItemCell select {
        margin-top: 0.8em;
    }
    
    /* So imageframed thumbs can be centered */
    td.giAlbumCell table, td.giItemCell table {
        margin: auto;
    }
    
    #gsPages span {
        padding: 0 0.3em;
        font-size: 1.4em;
        color: #274c78;   
    }
    
    #gallery #gsSidebar ul {
        font-size: 1em;    
    }
    
    /* ********************************************************************************
     * 
     */
    
    /* ********************************************************************************
     * Building blocks
     * #gallery              Default font/color settings
     * .gcBackground1,2..    Palette of backgrounds
     * .gcBorder1,2..        Palette of borders
     * a, h2, h3, etc        Standard html tags
     * .giTitle, .giSubtitle, .giDescription, .giInfo, .giSuccess, .giWarning, .giError
     *                       Palette of text styles
     * div.gbBreadCrumb      List of links/path elements
     * table.gbDataTable     Table for data/form elements with styles for shading rows
     * div.gbTabBar          UI component for selectable tabs
     * .autoComplete*        Styles for autoComplete popup lists
     */
    
    #gallery {
      color: #333;
    	font: normal 70% "Trebuchet MS", "Lucida Sans Unicode", sans-serif;
    }
    body.gallery {
        background-color: #313131;
    }
    
    .gcBackground1 {
                
    }
    
    .gcBackground2 {
        background-color: #313131;
    }
    
    .gcBorder1 {
        border: 0 solid #ccc;
    }
    
    .gcBorder2 {
        border: 0 solid #ccc;
    }
    
    #gallery a {
        font-weight: normal;
        text-decoration: none;
        color: #0086de;
    }
    #gsSidebar a:hover {
      background: #96c430;
    	color: #ffffff;
    	background-image:url(images/hover.gif); 
    	background-position: center left;
    	background-repeat: no-repeat;
    }
    
    #gallery a:active {
        text-decoration: none;
    }
    
    #gallery img {
      border-width: 0;  
    }
    
    #gallery h2
     {
      color: #274c78;
    	padding-top: 0px;
    	font-size: 1.4em;
    	margin-bottom: 0px;
    }
    
    #gallery h3
     {
      color: #274c78;
    	padding-top: 0px;
    	font-size: 1.4em;
    	margin-bottom: 0px;
    }
    
    #gallery h4
     {
    	color: #e05e08;
    	padding-top: 0px;
    	font-size: 1.4em;
    	margin-bottom: 0px;
    }
    
    #gallery input:focus, #gallery textarea:focus {
        background-color: #fff;
        color: #274c78;
    }
    
    #gallery input.inputTypeSubmit, #gallery input.inputTypeButton {  /* No input[type=submit] in IE */
        color: #e05e08;
        background-color: #fff;
        border-width: 1px;
        border-style: solid;
        border-color: #9bce4b #3f7d02 #3f7d02 #9bce4b;
    }
    
    #gallery select {
        font-size: 1.2em;
        color: #0086de;
    }
    
    .giTitle, #gallery h2, #gallery h3, #gallery h4 {
        font-size: 1.3em;
        font-weight: bold;
        color: #e05e08;
        padding-top: 20px;
        padding-bottom: 0px;
        padding-left: 0px;
        margin-right: 205px;
    }
    
    #gallery pre, #gallery tt {
        font-family: "Trebuchet MS", "Lucida Sans Unicode", sans-serif;
        font-size: 1.2em;
        color: #e05e08;
    }
    
    .giSubtitle {
        font-size: 1.0em;
        font-weight: normal;
        vertical-align: text-bottom;
        color: #e05e08;
    }
    
    .giDescription {
        font-size: 1.4em;
        line-height: 1.4em;
        color: #274c78;
        
    }
    
    .gbEmptyAlbum {
        height: 400px;
    }
    
    .giDescription h3.emptyAlbum {
        line-height: 4.0em;
        text-align: center;
    }
    
    .giInfo {
        font-size: 1.4em;
        color: #274c78;
        padding-top: 5px;
        padding-bottom: 0px;
        padding-left: 0px;
    }
    
    .giSuccess, .giWarning, .giError  {
        font-weight: bold;
    }
    
    .giSuccess { color: #ed2001; }
    .giWarning { color: #ed2001; }
    .giError { color: #ed2001; }
    
    .giNew, .giUpdated {
        border-width: 0px;
        border-style: ridge;
        padding: 0 6px;
        line-height: 1.9em;
    }
    
    #gsNavBar div.gbBreadCrumb {
        font-size: 1.2em;
        font-weight: normal;
        color: #0086de;
        margin-left: 20px;
    }
    
    #gsNavBar div.gbBreadCrumb a, #gsNavBar div.gbBreadCrumb span {
        padding: 0 0 0 14px;
        background: url('images/icon_path_separator.gif') no-repeat left;
    }
    
    #gsNavBar div.gbBreadCrumb a.BreadCrumb-1 {   /* no :first-child in IE */
        padding-left: 0;
        background-image: none;
        white-space: nowrap;
    }
    
    #gsThumbMatrix {
        width: 100%;
    }
    
    #gallery.IE div.gbBreadCrumb span {
        display: inline-block;   /* IE loses padding-left on wrapped inline nowrap element */
        padding-right: 4px;      /* IE has less space at right of each span */
    }
    
    #gsNavBar div.gbBreadCrumb span.BreadCrumb-1 {   /* no :first-child in IE */
        padding-left: 0;
        background-image: none;
    }
    
    #gsNavBar div.gbSystemLinks {
      float: right;
      padding-right: 10px;
      font-size: 1.4em;
    }
    
    table.gbDataTable th {
        text-align: right;
        background-color: #fff;
    }
    
    .gbEven {
        background-color: #98cc43;
    }
    
    .gbBusy {
        background-color: #a0d44b !important;
    }
    
    .gbOdd {
        background-color: #fff;
    }
    
    
    div.gbTabBar {
        font-size: 1.3em;
        font-weight: normal;
        margin: 0.8em 0 0;
        padding: 6px;    
        white-space: nowrap;
    }
    
    div.gbTabBar span.o {
        padding: 6px 0 5px 8px;    
    }
    
    #gallery.IE div.gbTabBar span.o {
        display: inline-block;   /* IE loses padding-left on wrapped inline nowrap element */
        margin-bottom: 1px;      /* ..and then adds padding differently with inline-block.. */
    }
    /* IE may clip off the right end of a long set of tabs, so allow IE to wrap them */
    #gallery.IE div.gbTabBar { padding-bottom: 0; white-space: normal; }
    #gallery.IE div.gbTabBar span.giSelected { margin-bottom: 0; }
    
    #gallery div.gbTabBar span span {
        padding: 6px 12px 5px 4px;
    }
    
    #gallery div.gbTabBar a {
        color: #e64113;
        text-decoration: none;
    }
    
    #gallery div.gbTabBar a:hover {
        color: #98cc43;
    }
    
    #gallery div.gbTabBar span.giSelected {
        padding-bottom: 6px;
    }
    
    #gallery div.gbTabBar span.giSelected span {
        color: #98cc43;
        padding-bottom: 6px;
    }
    
    .autoCompleteShadow {
        background-color: #3f7d02 !important;
    }
    
    .autoCompleteContainer {
        border: 0px solid #fff;
        background-color: #98cc43;
        border-top: 0px;
        border-bottom: 0px dotted rgb(0, 128, 0);
        margin-bottom: -1px;
        margin-top: 0px;
    }
    
    .autoCompleteContainer li.yui-ac-highlight {
        background-color: #fff;
    }
    
    #gallery .gbMarkupBar input {
        font-size: 1.1em;
    }
    
    .giSearchHighlight {
        font-weight: normal;
        background-color: #f02403;
    }
    
    
    /* ********************************************************************************
     * Sections
     * #gallery         Page container
     * #gsNavBar   			Top bar with breadcrumb and other links
     * #gsSidebar       Sidebar
     * #gsContent       Main content
     * main							Middle
     * content					Blue bars
     * footer						Footer
     */
    
    
    #main {
    	clear: both;
    	padding: 10px 10px 12px 28px;	
    	background: #fff;
    	border-left: 30px solid #96c430;
    	border-right: 30px solid #96c430;
    	height: 150px;
    	background: #ffffff url(images/main.jpg) no-repeat;
    }
    
    #content {
    	padding: 10px 10px 0px 28px;
    	background: #fff;
    	border-left: 30px solid #0086de;
    	border-right: 30px solid #0086de;
    }
    
    
    
    #gsNavBar div {
        margin-top: 0.1em;  /* Align system links with breadcrumb */
        font-weight: normal;
        font-size: 1.2em;
    }
    
    #gsSidebar div ul {   /* no > in IE */
        font-size: 1.1em;
        font-weight: normal;
    }
    
    #gsSidebar div ul ul { 
    		font-size: 1.0em;
    }
    
    #gsSidebar ul span {
        color: #f3e3d6;
    }
    
    div.gbNavigator div.next-and-last {
      float: right;
    }
    div.gbNavigator div.next-and-last.no-previous {
      float: none;
      text-align: right;
    }
    
    div.gbNavigator a.first {
      padding-left: 27px;
      background: url('images/nav_first.gif') left no-repeat;
    }
    
    div.gbNavigator a.previous {
      padding-left: 27px;
      background: url('images/nav_prev.gif') left no-repeat;
    }
    
    div.gbNavigator a.next {
      padding-right: 27px;
      background: url('images/nav_next.gif') right no-repeat;
    }
    
    div.gbNavigator a.last {
      padding-right: 27px;
      background: url('images/nav_last.gif') right no-repeat;
    }
    
    div.gbNavigator div.first-and-previous img {
      vertical-align: middle;
      padding-right: 0.5em;
    }
    div.gbNavigator div.next-and-last img {
      vertical-align: middle;
      padding-left: 0.5em;
    }
    
    #gallery.rtl div.gbNavigator div.next-and-last {
      float: left;
    }
    #gallery.rtl div.gbNavigator div.next-and-last.no-previous {
      float: none;
      text-align: left;
    }
    #gallery.rtl div.gbNavigator div.first-and-previous {
      text-align: right;
    }
    /* Both IE and Gecko have bugs with omitting padding on rtl inline content */
    #gallery.IE.rtl div.gbNavigator a {
      display: inline-block;
    }
    #gallery.gecko.rtl div.gbNavigator a {
      display: -moz-inline-box;
    }
    
    #gallery.rtl div.gbNavigator a.first {
      padding: 0 27px 0 0;
      background: url('images/nav_last.gif') right no-repeat;
    }
    #gallery.rtl div.gbNavigator a.previous {
      padding: 0 27px 0 0;
      background: url('images/nav_next.gif') right no-repeat;
    }
    #gallery.rtl div.gbNavigator a.next {
      padding: 0 0 0 27px;
      background: url('images/nav_prev.gif') left no-repeat;
    }
    #gallery.rtl div.gbNavigator a.last {
      padding: 0 0 0 27px;
      background: url('images/nav_first.gif') left no-repeat;
    }
    #gallery.rtl div.gbNavigator div.first-and-previous img {
      padding: 0 0 0 0.5em;
    }
    #gallery.rtl div.gbNavigator div.next-and-last img {
      padding: 0 0.5em 0 0;
    }
    
    div.block-search-SearchBlock a.advanced {
      display: block;
      padding: 3px;
      font-size: 1em;
    }
    
    div.block-core-ItemLinks {
      margin: 3px 0;
      font-size: 1.1em;
      font-weight: normal;
    }
    div.block-core-ItemLinks a {
      padding: 3px;
    }
    div#gsSidebar div.block-core-ItemLinks a {
      display: block;
    }
    
    div#gsSidebar div.block-core-PeerList a {
      display: block;
      padding: 3px;
    }
    
    div#gsSidebar div.block-core-PeerList span {
      font-weight: normal;
      display: block;
      padding: 3px;
    }
    
    div#gsSidebar div.block-core-PeerList span.current {
      color: #0473cc;
    }
    
    /* ***************************************************** */
    /*                   Dynamic blocks                      */
    /* ***************************************************** */
    
    div.block-comment-ViewComments {
      margin: 5px;
    }
    
    div.block-comment-ViewComments div.one-comment {
      border: 0px solid #9bce4b;
      padding: 5px;
      margin-bottom: 5px;
    }
    
    div.block-comment-ViewComments h3 {
    }
    
    div.block-comment-ViewComments span {
      padding-right: 5px;
    }
    
    div.block-comment-ViewComments p.info {
      font-style: italic;
      text-align: right;
      font-size: 0.95em;
    }
    
    div.block-core-GuestPreview {
      float: right;
      font-style: normal;
      text-align: right;
      font-size: 1.4em;
      color: #274c78;
      margin-bottom: 10px;
      padding-right: 30px;
    }
    
    #gallery.rtl div.block-core-GuestPreview {
      float: left;
    }
    
    span.block-core-SystemLink {
    }
    
    div.block-exif-ExifInfo {
      margin: 5px;
    }
    
    span.bsw_ButtonDisabled {
      color: #fe5430;
    }
    
    span.bsw_ButtonEnabled {
      color: #e05e08;
      cursor: pointer;
    }
    
    table.bsw_ParamTable {
      width: 100%;
      border: 0px solid #cfbdb1;
      border-collapse: collapse;
    }
    
    tr.bsw_ParamHeaderRow {
      background-color: #fff;
    }
    
    tr.bsw_ParamHeaderRow td {
      font-weight: bold;
      text-align: center;
      border: 0px solid #fe5430;
    }
    
    td.bsw_BlockCommands {
      white-space: nowrap;
      text-align: center;
    }
    
    #footer {
    	background: #fe5430;
    	color: #FED;
    	font-size: 1.3em;
    	line-height: 40px;
    	text-align: center;
    	width: 780px;
    }
    .footer a {
    	color: #FFD;
    	text-decoration: none;
    }
    .footer a:hover {
    	color: #FFF;
    	text-decoration: underline;
    }
    
    /* ********************************************************************************
     * Rating module style fix
     */
    .giRatingUI {
        margin: 10px auto; /* Required to center default rating module star images */
    }
    #gsThumbMatrix .giRatingAverageContainer {
        margin: auto;
    }
    Hope this helps some...

    Thanks again
    Terri

  • #7
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    And your HTML? We can't guess which CSS rules apply to the small image you posted? It's best to post your complete code and a link if you have one!?
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • #8
    Regular Coder
    Join Date
    Feb 2007
    Location
    Canada
    Posts
    924
    Thanks
    10
    Thanked 56 Times in 55 Posts
    A link would be best, then we don't need to clutter our workspace.
    Thanks.

  • #9
    New Coder
    Join Date
    Mar 2007
    Location
    Usa
    Posts
    18
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok .... here is one of the links.... It only does this on the pages that are like half pages (if that makes any sense at all)...

    http://www.photoclickr.com/gallery/m...avId=x7f96af9c

    Let me know if that link don't work but you shouldn't have a problem.

    Thanks
    Terri


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •