Herzlich Willkommen, lieber Gast!
  Sie befinden sich hier:

  Forum » HTML / XML / XHTML » CSS browser optimierung.

Forum | Hilfe | Team | Links | Impressum | > Suche < | Mitglieder | Registrieren | Einloggen
  Quicklinks: MSDN-Online || STL || clib Reference Grundlagen || Literatur || E-Books || Zubehör || > F.A.Q. < || Downloads   

Autor Thread - Seiten: > 1 <
000
13.06.2008, 17:57 Uhr
Fran



hey!
ich progge aktuell ne seite für mich.
Da ich viel mit css mache (div-container ahoj), muss ich dieses auch für browser optimieren. wie das für ie6 und 7 geht weiß ich.
ich muss aber wissen wie das auch für opera 9, firefox 2, Konqueror 3.5 und safari 3 geht.

kann mir jemand helfen?

allein im opera is ein margin pixel verschoben
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
001
13.06.2008, 21:19 Uhr
FloSoft
Medialer Over-Flow
(Administrator)


opera kann dir wurscht sein, firefox sollteste noch anpassen, und konquerer und safari normalerweise auch, firefox und ie sind die wichtigeren von den browsern. ansonsten standardkonform arbeiten, dann sollte es schon einigermaßen in den anderen browsern funktionieren (auf gut deutsch: wenns im firefox UND im ie geht, dann sollte es passen )
--
class God : public ChuckNorris { };
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
002
13.06.2008, 21:33 Uhr
Fran



Also den einen Pixel zu weit rechts im Opera ignorieren?
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
003
13.06.2008, 21:55 Uhr
FloSoft
Medialer Over-Flow
(Administrator)


z.b man kanns net allen recht machen

firefox und ie, mehr braucht ma net anpassen
--
class God : public ChuckNorris { };
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
004
13.06.2008, 23:03 Uhr
Fran



Hey!
hab folgendes problem:

Hover geht im firefox 3 nicht...im ie gehts..opera erkkennts auch nicht mehr. FF udn Opera sind jeweils die aktuellste Version, hat sich irgendwas im CSS geändert?

Mein quellcode:

Zitat:
a.blogiDLink:hover{
color:#999;
text-decoration:underline;
font-size:12px;
}

a:hover {color:#666;text-decoration:none;}



visited, active und link gehen..
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
005
14.06.2008, 09:39 Uhr
FloSoft
Medialer Over-Flow
(Administrator)


was meinst du mit "hover geht nicht mehr"? zeig mal den html-code dazu, evtl ist dir ein denkfehler unterlaufen
--
class God : public ChuckNorris { };
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
006
14.06.2008, 15:27 Uhr
Fran




Code:
  <div align="center" class="documentContent">
      <div align="left" class="indexContent">
         {if $indexemptycontent}
            {$indexemptycontent}
         {else}
            {foreach from=$blogcontent item=blog}
         <div class="contentFrame">
            <div align="left" id="blogHead">
               <div align="left" class="blogTitle">
                  <span id="blogTitleFont">
                     {$blog.blogtitle} | {$blog.blogdate}
                  </span>
               </div>
               <div align="right" class="blogPHPID">
                  <div class="blogID">
                     <span id="blogiDLink">
                        <a href="./index.php?page=Comment&nr={$blog.blogID}">{$blog.blogID}</a>
                     </span>
                  </div>
               </div>
            </div>
            <br />
            <div align="left" id="blogContent">
               {$blog.content}
               <div align="right" id="blogPostComment">
                  <a href="./index.php?page=Comment&nr={$blog.blogID}">Kommentar posten</a>
               </div>
            </div>
         </div>
            {/foreach}
         {/if}
      </div>
   </div>


Das in den {} Klammern ist vom Templatesystem von Smarty, einfach ignorieren.
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
007
14.06.2008, 15:49 Uhr
FloSoft
Medialer Over-Flow
(Administrator)


ja so funzt das natürlich nicht

wenn dann

<a class="blogiDLink"> ...

id= ist auf jedenfall falsch, weil du das oben nicht als id definierst und davon dann auch nur EINE exisitieren DARF, was du willst (so wie du das definiert hast) ist eine klasse, aber eben auf das element "a" und nicht auf span. kannst natürlich so machen:

oder im css


Code:
span.blogiDLink a:hover{
color:#999;
text-decoration:underline;
font-size:12px;
}

a:hover {color:#666;text-decoration:none;}



dann würde dein html soweit stimmen das du eben <span class="blogiDLink" schreiben solltest, nicht id, denn id ist immer unique.

Auch deine anderen ids sind falsch, das ist wenn dann class


ids im css sind so:


Code:
#identifier { }



klassen (eben für mehrere sachen und nicht unique)

Code:
.classname {}



oder


Code:
tag.classname {}



ums auf "tag" anzuwenden.

Schachteln geht eben wie in dem oben auch:


Code:
tagA tagB {
}



gilt nur für


Code:
<tagA><tagB /></tagA>



und nicht für


Code:
<tagB />



mehrere eben mit , dazwischen:


Code:
tagA, tagB {
}



gilt für tagA und tagB Elemente.
--
class God : public ChuckNorris { };
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
008
14.06.2008, 16:31 Uhr
Fran



jo, hab ihc mal geändert und gleich ne andere frage.

http://img162.imageshack.us/img162/6917/asdwe6.jpg

Im Firefox ist das 3 Pixel verschoben, aber nur wenn kommentare geschrieben wurden...
Ich weiß nicht warum..hier mal der neue Quellcode;


Code:
   <div align="center" class="documentContent">
      <div align="left" class="indexContent">
         {if $indexemptycontent}
            {$indexemptycontent}
         {else}
            {foreach from=$blogcontent item=blog}
         <div class="contentFrame">
            <div align="left" class="Head">
               <div align="left" class="blogTitle">
                  <span id="blogTitleFont">
                     {$blog.blogtitle} | {$blog.blogdate}
                  </span>
               </div>
               <div align="right" class="blogPHPID">
                  <div class="blogID">
                     {if $comlinks}
                     <a class="iDLink" href="./index.php?page=Comment&nr={$blog.blogID}">{$blog.blogID}</a>
                     {else}
                     <span class="iDLink">{$blog.blogID}</span>
                     {/if}
                  </div>
               </div>
            </div>
            <br />
            <div align="left" class="Content">
               {$blog.content}
               {if $comlinks}
               <div align="right" class="blogPostComment">
                  <a href="./index.php?page=Comment&nr={$blog.blogID}">Kommentar posten</a>
               </div>
               {/if}
            </div>
         </div>
               {if $nocoms}
            <br />
                  {$nocoms}
               {else}
                  {foreach from=$comtrue item=com}
            <br />
            <b>Kommentare:</b>
            <div class="contentFrame">
               <div align="left" class="Head">
                  <div align="left" class="blogTitle">
                     <span id="blogTitleFont">
                        {$com.cus_name} | {$com.cus_date}
                     </span>
                  </div>
                  <div align="right" class="blogPHPID">
                     <div class="blogID">
                        <span class="iDLink">{$com.comID}</span>
                     </div>
                  </div>
               </div>
               <br />
               <div align="left" class="Content">
                  {$com.cus_text}
               </div>
            </div>
                  {/foreach}
               {/if}
            {/foreach}
         {/if}
      </div>
   </div>



und ob css..kp:

Code:
@charset "utf-8";

   body {
      background-color:#333333;
   }
  
   a:link {color:#333;text-decoration:underline;}
   a:hover {color:#666;text-decoration:none;}
   a:visited {color:#333;text-decoration:underline;}
   a:active {color:#333;text-decoration:underline;}

   .documentHeader {
      background-image:url(./images/menuHeader.png);
      width:800px;
      height:194px;
   }
  
   .documentHeaderMenu {
      margin-left:70px;
   }
  
   .documentFoot {
      background-image:url(./images/footer.png);
      width:800px;
      height:65px;
   }
  
   .documentContent {
      background-color:#F0F0F0;
      margin-left:199px;
      width:640px;
   }
  
   #noContent {
      font-style:italic;
      font-weight:bold;
      font-size:13px;
   }
  
   .indexContent {
      background-color:#CCC;
      border: 1px solid #999;
      width:98%;
   }
  
   .Head {
      width:80%;
      background-color:#DADADA;
      border-right: 1px solid #999;
      border-bottom: 1px solid #999;
      padding:2px;
   }
  
   .Content {
      width:98%;
      background-color:#DADADA;
      border-right: 1px solid #999;
      border-top: 1px solid #999;
      padding:2px;
   }
  
   .blogPostComment {
      margin:5px;
   }
  
   .blogID {
      display:inline;
      border:1px solid #999;
      padding:0 3px 0 3px;
   }
  
   .blogTitle{
      float:left;
   }
  
   .iDLink a {
      color:#333;
      text-decoration:none;
      font-size:12px;
   }
  
   .iDLink a:hover{
      color:#999;
      text-decoration:underline;
      font-size:12px;
   }
  
   .iDLink a:visited {
      color:#333;
      text-decoration:none;
      font-size:12px;
   }
  
   .iDLink a:active {
      color:#333;
      text-decoration:none;
      font-size:12px;
   }
  
   .iDLink {
      color:#333;
      text-decoration:none;
      font-size:12px;
   }
  
   .contentFrame {
      border:1px solid #999;
      margin:2px;
   }
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
009
15.06.2008, 22:05 Uhr
Fran



Das liegt daran, das der Scrollbalken hinzukommt, ich weiß aber nicht was ich noch anders machen soll damit das geht...hab aber Quellcodegeändert, trotzdem ist es immernoch um 1px zu weit links, wenn der Scrollbalken da ist..
 
Profil || Private Message || Suche Download || Zitatantwort || Editieren || Löschen || IP
Seiten: > 1 <     [ HTML / XML / XHTML ]  


ThWBoard 2.73 FloSoft-Edition
© by Paul Baecher & Felix Gonschorek (www.thwboard.de)

Anpassungen des Forums
© by Flo-Soft (www.flo-soft.de)

Sie sind Besucher: