tutorials.de Buch-Aktion 05/2012
Like Tree4Danke
  • 2 Beitrag von javaDeveloper2011
  • 1 Beitrag von javaDeveloper2011
  • 1 Beitrag von Sprint
ERLEDIGT
JA
ANTWORTEN
5
ZUGRIFFE
640
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 05.12.11 19:40 #1
    Joe Joe ist offline Mitglied Brokat
    Registriert seit
    Aug 2009
    Ort
    Thüringen
    Beiträge
    339
    Ich überarbeite gerade etwas das Design meiner Seite. So grafisch bin ich eher wohl kein Genie

    Zum Problem:
    Beim ausprobieren verschiedener Fonts (Standart) stellte ich fest das es a) Utopisch übergrosse Grössen im IE darstellt und oder b) ganz andere Schriftarten im IE darstellt.
    Im Firefox hingegen sieht das so wie gewollt aus.
    Ausserdem habt ihr schon mal nen Textschatten für den IE hinbekommen?

    Wäre nett wenn also jemand mir Tipps zu den angesprochenen Themen geben kann.
    Meine Seite: www.end-time.de
    CSS:
    Code css:
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196

    body
{
background-color: #000;
background-image: url(../img/wasteland3.jpg);
background-repeat: no-repeat;
background-position:top center;
background-attachment:fixed;
padding:0px;
text-align: center;
}
div#wrapper{
width: 748px;
    margin: 15px auto;
    text-align: left;
        //  Fusszeile: Hintergrundbild soll sichtbar/ nicht sichtbar sein
    // background: url(../img/content_hg.gif) repeat-y;
}
div#header{
margin: 15px 0 0 0;
width: 743px;
}
div#navi{
margin: 153px 0 0 0;
background: url(../img/navi.png) no-repeat;
width: 135px;
height: 200px;
float: left;
}
div#login{
margin: 10px 0px 0px 0px;
background: url(../img/login.png) no-repeat;
width: 135px;
height: 100px;
float: left;
}
 
div#content{
   width: 608px;
   height: 600px;
    float: right;
        background: url(../img/testglas.png) no-repeat;
}
div#news{
   width: 304px;
    float: right;
}
div#counter{
position:absolute; top:650px;
    float: right;
}
div#footer{
//background-color: #454545;
width: 608px;
float: right;
}
.clear{
clear: both;
}
div#title{
background: url(../img/MettalHeader.png) no-repeat;
float: right;
width: 608px;
height: 150px;
}
a img{
border: 0;
}
.title_ausrichtung{
margin: 45px 0 0 55px;
//text-shadow: 1px 1px 0px #202020, -1px -1px 0px #606060;
}
.title_browsergame{
font-family: Impact, fantasy;
font-size: 240%;
font-weight: bold;
color: #8B8970;
text-shadow: 2px 2px 0px #202020, -2px -2px 0px #606060;
}
.title_keywords{
font-family: Impact, fantasy;
font-size: 100%;
letter-spacing: 2px;
color: #EECFA1;
text-shadow: 2px 2px 0px #202020, -2px -2px 0px #606060;
}
ul.navi{
font-family: Oldtown, fantasy;
font-size: 14px;
line-height: 180%;
list-style-type: none;
margin: 0 25px 0 0;
padding: 0;
text-align: right;
}
a.navi{
color: #EECFA1;
text-decoration: none;
padding: 0 25px 0 0;
}
a.navi:hover{
text-decoration: underline;
background: url(../img/navi_dot_hover.gif) no-repeat right;
}
a.navi_aktiv{
color: #CDBE70;
text-decoration: none;
padding: 0 25px 0 0;
font-weight: bold;
background: url(../img/navi_dot_aktiv.gif) no-repeat right;
}
a.navi_aktiv:hover{
text-decoration: underline;
}
div#footer_ausrichtung{
font-family: Charcoal, Chicago, sans-serif;
font-size: 80%;
color: #0000CD;
// border-top: 1px dashed #F60;
margin: 0 30px 15px 30px;
padding-top: 15px;
}
.links{
float: left;
}
.rechts{
float: right;
}
.unten{
float: right;
padding:  0px 0px 50px 0px;
}
.ta_r{
text-align: right;
} 
h1{
    margin: 10px 10px 10px 10px;
    font-family: Impact, fantasy;
    font-size: 120%;
    font-weight: normal;
    color:  #CDBE70;
    text-shadow: 1px 1px 0px #202020, -1px -1px 0px #606060;
}
h2{
    margin: 10px 10px 10px 10px;
    font-family: Charcoal, Chicago, sans-serif;
    font-size: 80%;
    font-weight: bold;
    color: #CDBE70;
    text-shadow: 1px 1px 0px #202020, -1px -1px 0px #606060;
}
div#content p{
    margin: 10px 10px 10px 10px;
    font-size: 90%;
    line-height: 150%;
    color: #EECFA1;
    font-family: Charcoal, Chicago, sans-serif;
    text-shadow: 1px 1px 0px #202020, -1px -1px 0px #606060;
}
p.or{
    padding: 0;
    margin: 0;
}
div.border-right{
    border-right: 1px solid #000;
height: 580px;
}
div.border-top{
    border-top: 1px solid #000;
}
div#content .datum{
    color: #FFB90F;
    font-size: 70%;
}
div#content .autor{
        margin: 10px 10px 10px 10px;
    color: #EE7942;
    font-size: 80%;
}
div#content .news_text{
    font-size: 75%;
    line-height: 120%;
}
.fett{
    font-weight: bold;
}
a{
    color: #CD950C;
}
a:hover{
    text-decoration: none;
}
.infobox{
    padding: 10px 15px;
    border: 1px solid #000;
    background-color: #5C5C5C;
}
     
    Zitieren Zitieren
  2. 05.12.11 21:42 #2
    Avatar von javaDeveloper2011
    javaDeveloper2011 javaDeveloper2011 ist offline Mitglied Brokat
    Registriert seit
    Feb 2011
    Beiträge
    445
    Blog-Einträge
    5
    Ich glaube, das ist es, was du brauchst: http://www.fontsquirrel.com/fontface
    Joe und CPoly bedanken sich. 
    Zitieren Zitieren
  3. 05.12.11 22:07 #3
    Joe Joe ist offline Mitglied Brokat
    Registriert seit
    Aug 2009
    Ort
    Thüringen
    Beiträge
    339
    Hmm so wie ich das mitbekommen habe ist nur der IE in der Lage alle Fonts abzubilden. Ich schätze das in meinen Fall WOFF fonts die einzigen sind die alle gängigen Browser beherschen.

    Ehrlich da gehört ne Din ider ISO Norm langsam hinne. Das ist ja ein pures Chaos wenn man sich das erste mal damit auseinandersetzt.

    Danke dir javaDeveloper2011 immerhin bringt mich "das" WOFF fonts etwas weiter
     
    Zitieren Zitieren
  4. 05.12.11 22:52 #4
    Avatar von javaDeveloper2011
    javaDeveloper2011 javaDeveloper2011 ist offline Mitglied Brokat
    Registriert seit
    Feb 2011
    Beiträge
    445
    Blog-Einträge
    5
    Hi,

    das tolle am Fontsquirrel ist ja gerade, dass du dir um irgendwelche Standards - die dann eh nicht in allen Browsern und in älteren Versionen ja sowieso unmöglich umgesetzt sein können - keine Gedanken mehr machen brauchst.

    Einfach @font-face Kit zusammenstellen!!
    Joe bedankt sich. 
    Zitieren Zitieren
  5. 06.12.11 00:52 #5
    Sprint Sprint ist offline Mitglied Platin
    Registriert seit
    Apr 2004
    Ort
    Die heimliche Hauptstadt des Bieres
    Beiträge
    579
    Willkommen im Club. Nachdem es wohl nie gelingen wird, diese komischen Dinger auszurotten, setze ich auf Google Fonts. Die Auswahl ist inzwischen so groß, daß fast alle Bedürfnisse damit bedient werden können.
    Aber setz keine zu großen Hoffnungen auf Google Fonts, Fontsquirrel usw. Nach meiner Erfahrung wünschen sich vor allem Windows User recht schnell wieder Standardschriften zurück, da es scheinbar noch immer große Schwierigkeiten macht, Nicht-Standard-Schriften augenfreundlich scharf darzustellen. Ich höre jedenfalls immer wieder Klagen von Windows Usern, daß diese oder jene Schrift unscharf wäre. Nach einem Wechsel auf die ausgelutschten Standard Fonts ist wieder alles gut. Linux kann das etwas besser und Mac OS richtig gut. Deshalb nutze ich besondere Schriften nur noch als Überschriften, die schön groß geschrieben sind. Zum Glück gibt es aber auch noch ein paar Fonts, die in allen drei großen Systemen zu über 80% vorhanden sind und nicht schon in zig Millionen Seiten eingesetzt werden.
    Joe bedankt sich. 
    Think Different.
    Zitieren Zitieren
  6. 06.12.11 09:41 #6
    Joe Joe ist offline Mitglied Brokat
    Registriert seit
    Aug 2009
    Ort
    Thüringen
    Beiträge
    339
    Das Problem klein = unscharf ist mir auch schon aufgefallen. Ich selbst nutze ja auch Windows. Ich wollte ein paar Fonts nutzen die etwas Retro, Fallout, Bioshock ausschauen. Meist etwas fetter und Richtung 50er 60er Jahre Werbeplakatschrift.
    Grunge-Fonts sehen in kleiner Schrift richtig mies aus. Man muss wirklich viel rumprobieren mit den verschiedenen Schriften bis man mal was gefunden hat. Hat man mal was gefunden Ist dann noch der IE - kann kein textshadow - zeigt gern völlig andre Schriften an.

    Coufin.js hatte ich schon bissel probiert scheint mir aber auch bissel unhändisch und nimmt nicht jeden Font. Fonts die keine Veränderungen zulassen gehen garnicht.

    Also schau ich mir mal Google Fonts, Fontsquirrel an .. irgendwann findet man sicher irgendwas in dem Chaos was akzeptabel aussieht und Crossbrowserfähig is
     
    Zitieren Zitieren
« Unterstreichung im Menü (nicht text-decoration) | 1 parent Div mit fester Größe (pixel), 2 child Divs -> dynamisches Lückenfüllen »

Ähnliche Themen

  1. Crossbrowser Menü Buggy
    Von sh0x im Forum CSS
    Antworten: 1
    Letzter Beitrag: 01.07.05, 09:04
  2. Crossbrowser Bibliothek
    Von zeppo im Forum Javascript & Ajax
    Antworten: 2
    Letzter Beitrag: 01.07.05, 07:43
  3. TrueType-Fonts zu Type1 Postscript-Fonts konvertieren
    Von typometer im Forum Typografie
    Antworten: 2
    Letzter Beitrag: 02.01.03, 16:48
  4. CSS Crossbrowser Tutorial
    Von MasterGeo im Forum CSS
    Antworten: 4
    Letzter Beitrag: 26.04.02, 14:21
  5. Input Felder Crossbrowser gleich formatieren
    Von MasterGeo im Forum CSS
    Antworten: 3
    Letzter Beitrag: 29.01.02, 12:48