...

View Full Version : Firefox and IE issues *sigh*



BabyDev
09-12-2007, 05:34 AM
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

rams1703
09-12-2007, 05:46 AM
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

BabyDev
09-12-2007, 05:52 AM
you need to see the css yea?

rams1703
09-12-2007, 08:14 AM
s ofcourse cant tell without see

but problem is the same what i wrote in previous post

ragards,
rams

ahallicks
09-12-2007, 10:06 AM
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.

BabyDev
09-12-2007, 04:24 PM
Ok so here is my css file.....



/* ********************************************************************************
* 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

ahallicks
09-12-2007, 05:03 PM
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!?

jlhaslip
09-12-2007, 07:59 PM
A link would be best, then we don't need to clutter our workspace.
Thanks.

BabyDev
09-12-2007, 10:17 PM
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/main.php?g2_view=core.ItemAdmin&g2_subView=core.ItemDelete&g2_itemId=7&g2_selectedId=14&g2_return=%2Fgallery%2Fmain.php%3Fg2_GALLERYSID%3D2b02627ff862b18187859b2de3385764%26g2_navId%3Dx7f9 6af9c&g2_returnName=album&g2_navId=x7f96af9c

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

Thanks
Terri



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum