|
||||||
| FAQ | Members List | Calendar | Today's Posts | Search |
Topic Review (Newest First)
|
| Feb 27th, 2008 04:02 AM | ||
| MetalMilitia |
OK so obviously you'll need to update the page header to reflect the changes in the footer so as to keep nested elements consistently styled. Not sure why it disappeared in IE7, it's kind of hard to debug CSS using only Firebug as it only works in Firefox. Also I don't want to be the bringer of bad news but I checked the site in IE6 and it is, for want of a better word, extremely fucked up. If you want to send me the forum in a .zip I should be able to run a local copy and get a better idea of what the problems are (PM me and I'll send you my e-mail address). |
|
| Feb 26th, 2008 08:28 PM | ||
| Chojin |
Okay, I put that in. I had to change url(./styles/proStrikers/imageset/strikers_footer.jpg) to url("{T_IMAGESET_PATH}/strikers_footer.jpg") to get the footer to show up. Now, in firefox, the top navbar is pushed too far to the right, while the bottom navbar (which uses the same style) is fine (???). In IE, the header is offset to the right, navbars are fine, and the footer is nonexistant. God damnit. |
|
| Feb 24th, 2008 06:22 AM | ||
| MetalMilitia |
Ah, OK I think I see your problem. I believe it's acting strangely because the page-footer is in the wrong place and you're trying to hack the footerbar back into the correct place. try this: Move the page footer into the correct position: #page-footer { clear:both; <!--You don't need this, as clear only works with floated elements--> margin:0pt auto; padding:25px 50px 0px 0px; width:730px; position:relative; left:-25px; <!--Move the tag to the left of the main wrapper--> } Adjust the navigation so it lines up with the new footer: .navbar { background-color:#EBEBEB; clear:both; padding:0pt 10px; margin-left:40px; <!-- Push the navbar in a bit so it doesn't look weird--> } Get rid of the hacky x positioning: .footerbar { background:#EBEBEB url(./styles/proStrikers/imageset/strikers_footer.jpg) repeat-x scroll 0pt; color:#FFFFFF; height:86px; margin-bottom:0pt; padding-bottom:0pt; position:relative; top:15px; width:780px; } I'm not able to test these changes in IE but I suspect they'll fix your main issue. |
|
| Feb 23rd, 2008 09:05 PM | ||
| Chojin | Netscape is officially dead as of yesterday, though, so that's a step in the right direction. | |
| Feb 23rd, 2008 03:51 PM | ||
| Mockery | You know, it amazes me... back when I first started doing web design I was always pissed about all the little differences between coding for Netscape and IE, but I was always confident that those differences would eventually be eliminated, thus making the lives of web designers easier. 10 years later, it's still the same annoying bullshit differences that web designers have to deal with. | |
| Feb 23rd, 2008 03:44 PM | ||
| MetalMilitia |
Quote:
|
|
| Feb 23rd, 2008 03:36 PM | ||
| Chojin |
I might as well tip my hand here so you can see what I mean: http://www.strikerscharged.com If you look at the footer in IE and Firefox you'll see what I'm trying to move left. The icons and shit in the thread lists move around and stuff in IE too for some reason, but one thing at a time, here ;< |
|
| Feb 23rd, 2008 03:35 PM | ||
| Chojin |
okay, no, IE seems to be using the values in the important block. I tried both right: 25px !important; right: 35px; and right: 35px; right: 25px !important; With the idea that the element in question needs to be further to the left in IE, but both times IE takes the 25px value. |
|
| Feb 23rd, 2008 03:31 PM | ||
| Chojin | i will give that a whirl, thanks :D | |
| Feb 23rd, 2008 03:26 PM | ||
| MetalMilitia |
Do you the Firefox extension Firebug installed? I have a feeling it will tell you were exactly the element you're looking for is within the DOM. Not sure I understand completely what you're asking though. If you just need a way of applying CSS attributes to classes conditionally, based upon the user's browser you may want to look at "!important". It's a horrible hack but it will cause IE to ignore an attribute and firefox to apply it in preference to any other declaration of the same attribute. So you could have: top : 1px !important; top : 2px; This will mean firefox will use the important attribute in preference and IE will ignore it (because it doesn't support it). |
|
| Feb 23rd, 2008 03:18 PM | ||
| Chojin |
I need some serious CSS help Most of my problem stems from the differences in the way IE and Firefox render pages. I've been reading around and sites keep recommending that I use CSS child selection to give different commands to firefox and IE. That's all well and good, but what the fuck are things in a CSS block the child of? This is for a phpbb3 board I'm working on, so I don't even know exactly where everything is going. BUT FOR EXAMPLE if have a line in my stylesheet.css that goes like this: Code:
.footerbar {
background: #ebebeb none repeat-x 0 0;
color: #FFFFFF;
position: relative;
right: 25px;
top: 15px;
clear:both;
width: 780px;
height: 86px;
margin-bottom: 0;
padding-bottom: 0;
background-image: url("{T_IMAGESET_PATH}/strikers_footer.jpg");
}
* > .footerbar is understood in both browsers, so I can't use that. html > body .footerbar doesn't let either browser understand it. Insight, prz. |
|
