And another IE7 issue - looks great FF/Opera
Posted: 10 June 2008 03:34 PM   [ Ignore ]
Newbie
Rank
Total Posts:  1
Joined  2008-06-10

I have never done this before, but I did a lot of reading about coding in CSS and put it together. I bug checked it in W3C and everything came back clean, except a couple elements I’d added to play around with later. It’s only one piece (the main nav) that’s giving me issues. I do have padding on it, but I also have padding on the body section, so I have no idea why one looks ok and the other doesn’t.

atlantatalentum.com is the site, I think you can view source and get the html. Here’s my css, i’m aware the scrollbars don’t work, the rest checked clean. What am I doing wrong?

@charset "utf-8";

/* Page Styling */

{
    margin
0px;
    
padding0px;
}

html {
    scrollbar
-face-color#99b;
    
scrollbar-arrow-color#fff;
    
scrollbar-highlight-color#fff;
    
scrollbar-shadow-color#99c;
    
scrollbar-3dlight-color#000;
}


body {
    background
#7a3233 url(images/Left-Side-Border.jpg) left top repeat-x;
    
z-index1;
    
margin0px auto;
    
font-familyGeorgiaCalisto MTGaramondserif;
    
floatinherit;
}


div
.layoutbox {
    width
760px;
    
margin0px auto;
    
}


    
/* Styling */

div#header {
    
width:645px;
    
height:213px;
    
font-size10px;
    
text-alignleft;
    
clearboth;
    
margin0px;
    
color#000000;
    
background-imageurl(images/Header.jpg);
    
background-repeatno-repeat;
}

div
#nav {
    
positionabsolute;
    
top213px;
    
width159px;
    
height462px;
    
font-size10px;
    
text-alignleft;
    
padding0px 40px 40px 5px;
    
clearboth;
    
margin0px;
    
color#000000;
    
background-imageurl(images/Navigation.jpg);
    
background-repeatno-repeat;
    
z-indexauto;
        
}

div
#body {
    
top213px;
    
width451px;
    
height462px;
    
fontnormal 16px Georgia"Calisto MT"Garamond;
    
text-alignjustify;
    
text-indent20px;
    
clearboth;
    
margin0px 0px 0px 159px;
    
color#000000;
    
background-imageurl(images/body.jpg);
    
background-repeatno-repeat;        
}
    
    
div
#footer {
    
top676px;
    
text-alignleft;
    
clearboth;
    
margin0px 0px 0px 26px;
    
width584px;
    
background-color#7A3233;
}

#footer a:visited {
    
color#e8d8ca;
}

.Heading
{
    padding
0px 0px 0px 0px;
    
margin0px;
    
fontbold 20px HANA"Copperplate Gothic Light"Garamondsans-serif;
    
text-transformuppercase;
    
color#000000;
    
text-alignleft;
    
text-decorationunderline;
}

.body_text
{
    padding
0px 15px 0px 0px;
    
margin0px;
    
font15px Georgia"Calisto MT"Garamondserif;
    
text-transformnone;
    
color#000000;
    
text-alignjustify;
    
text-decorationnone;
}

.mailto a:linka:visiteda:activea:hover{
    text
-transformnone;
    
}

a
:link { 
    font
bold 12px HANA"Copperplate Gothic Light"Garamondsans-serif;
    
text-transformuppercase;
    
text-decorationnone
    
color#000000;
    
}
a
:visited { 
    font
bold 12px HANA"Copperplate Gothic Light"Garamondsans-serif;
    
text-transformuppercase;
    
text-decorationnone
    
color#4b1515;
    
}
a
:hovera:active { 
    font
bold 12px Georgia"Calisto MT"Garamondserif;
    
text-transformuppercase
    
text-decorationunderline
    
color#000000;
    
}

Profile
 
 
Posted: 10 June 2008 11:10 PM   [ Ignore ]   [ # 1 ]
Jr. Member
RankRank
Total Posts:  38
Joined  2007-09-03

ShadowFax - I looked at your site in both IE and in FF.  I can see the problem.  Having looked at your HTML code the first thing that occurred to me was that perhaps it was more complicated than really necessary for the end effect that you appear to want.  But perhaps I am wrong there.

In any case, your first step should be to get developer toolbars for both IE and FF.  Start off with the
, use the option to outline block level elements and show element id/class information.  Use these features to confirm that the effect as rendered is the one you wanted.  Even if you are you might find that there is an easier way to deliver it.

With this done use the IE toolbar to do the same thing.  It is not nearly as good as FF but even so it should help you identify the problem more accurately.

Profile
 
 
Posted: 21 December 2010 12:59 AM   [ Ignore ]   [ # 2 ]
Jr. Member
RankRank
Total Posts:  42
Joined  2010-12-14

use css3please.com it will shorten your code time greatly.

Profile
 
 
Posted: 01 February 2011 06:13 AM   [ Ignore ]   [ # 3 ]
Newbie
Rank
Total Posts:  12
Joined  2011-01-17

There are three reasons for this: 

Font Availability: When you tell your Web page to use a particular typeface, such as “Arial,” you may not always get the font you want. Fonts are a computer resource, and not all computers have the same fonts as your computer karın germe. That’s true even between different PCs, but it’s especially true between the PC and the Mac. If the typeface of your page suddenly changes between these computers, you’ve probably used a font that isn’t available on both computer types estetik cerrahi.

Font Size: The Mac will generally render your typeface in a smaller pixel size than the PC will. That’s especially true if you use the FONT tag to set your type size, since this tag uses abstract units to define size. You can avoid this problem is you use Cascading Style Sheets to set your font size in pixels. ac meme büyütme.

Internet Explorer: Microsoft outsources the development of Internet Explorer for the Mac, and so to a large extent this is a different browser from the PC version. In particular, the Mac version of Internet Explorer is prone to quirks and bugs that you won’t see in the PC version. If you check your Web page under only one browser on the Mac, do so under Internet Explorer kepçe kulak!

Profile
 
 
Posted: 20 February 2011 03:09 PM   [ Ignore ]   [ # 4 ]
Newbie
Rank
Total Posts:  23
Joined  2011-01-06

If you don’t test your pages using different screen resolutions, your page may be stretched to fit a large screen, or be cropped to fit a small screen. Many experienced Web designers use HTML tables to control their page layout, yet they design their pages on large, 1024x768 pixel screens. When these pages are displayed on smaller computer screens, the browser may not be able to fit all the content onto the screen. In these cases, the content will scroll of the right of the page. While this may not sound like much of a problem, users hate scrolling left and right to view a page. This problem should be easy to avoid, yet a surprising number of otherwise well-designed Web sites don’t fit within the standard alan adı sorgulama, web tasarım, masaj salonu, plaka sprgulama, kızlık zarı, altın fiyatları, telefon sorgulama 800-pixel PC computer screen. This is especially a problem for pages built by graphic artists using a Macintosh, whose standard screen size is 1024x768. Many designers forget that designing for an 800-pixel screen means using roughly a 750-pixel layout.

Profile