Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [xhtml/css] Dziwne tło pod tekstem w IE :/
bobo168
post 29.11.2006, 18:16:29
Post #1





Grupa: Zarejestrowani
Postów: 201
Pomógł: 9
Dołączył: 23.08.2006

Ostrzeżenie: (0%)
-----

Witam mam problem mianowicie chodzi o strone: http://www.technicy.ovh.org .
Mam tam wyświetlanie linków z menu. Linki te są wyśwylanez listy (<li>).
No i w FF i Operze wszytsko wyświetla się ok. Natomiast w IE pod tekstem z menu jest dziwne szare tło :/ I nie wiem o co może chodzić :| Dam tu cały kod strony razem z css, prosze o napisanie mi gdzie jest błąd i jak to naprawić.
index.html:
Kod
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <link rel="stylesheet" href="style.css" type="text/css" />
  <!--[if IE]>
    <link rel="stylesheet" href="style-ie.css" type="text/css" />
    <script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->

  <title>Paweł Mościanica - ELECTRONICWEB.EU - newmedia conception</title>
</head>
<body id="home">
<div id="top">
<img class="fleft" src="img/pm-yel.jpg" alt="Paweł Mościanica" />
<span class="info">
<strong>Mail/MSN:</strong> info@electronicweb.eu <strong>| GG:</strong> 5077775 <strong>| Mobile:</strong> 507 567 172</span>
<ul>
<li><a href="index.html"><img src="img/m-home.png" alt="home" /></a></li>
<li><a href="web.php"><img src="img/m-web.png" alt="web" /></a></li>
<li><a href="Id.php"><img src="img/m-id.png" alt="id" /></a></li>
<li><a href="Print.php"><img src="img/m-print.png" alt="print" /></a></li>
<li><a href="Presentations.php"><img src="img/m-present.png" alt="presentation" /></a></li>
</ul></div>
<div id="nav">
<a class="aleft" href="lista.php">&nbsp;</a>
<a class="aright" href="web.php">&nbsp;</a>
</div>

<div id="content">
<div id="corn-t">
<div id="corn-b">
<img src="img/newmedia.jpg" alt="newmedia" />
</div></div>
<div id="wrap"></div>

</div>
</body>
</html>

style.css
Kod
/* CSS Document */
* {
    margin: 0;
    padding: 0;
}
a img {
    border: 0;
    text-decoration: none;
}
a {
    text-decoration: none;
        
}
body {
    font-family: tahoma, arial, serif;
    color: #fff;
    font-size: 10px;
    background: #272727 url('img/topbgr.gif') repeat-x 0 0;
}
#container {
    width: 100%;
    position: relative;
}
.fleft {
    float: left;
}
.fright {
    float: right;
}
div#top {
    height: 110px;
    width: 940px;
    background: url('img/blabla.gif') no-repeat 170px 0;
}
div#content {
    background: url('img/bgr.jpg') no-repeat 0 0;
    width: 100%;
    min-height: 930px;
}
div#wrap {
  margin: 0;
  float: right;
    height: 950px;
    width: 1px;
}
div#top span.info {
    float: left;
    line-height: 80px;
    text-align: center;
    width: 500px;
}
div#top ul {
    float: right;
    list-style-type: none;
    margin: 30px 5px 30px 0;
}
div#top ul li {
    float: left;
    margin: 0 0 0 8px;
}
div#top ul li a {
    display: block;
    padding: 5px 3px 2px;
}
body#home div#top ul li a:hover {
    background: #EBA205;
}
body#id div#top ul li a:hover {
    background: #1B8FC2;
}
body#present div#top ul li a:hover {
    background: #DC3022;
}
body#print div#top ul li a:hover {
    background: #990448;
}
body#web div#top ul li a:hover {
    background: #ABC75E;
}

div#nav {
    background: url('img/nav.gif') no-repeat;
    position: absolute;
  right: 5px;
    top: 65px;
    width: 50px;
    height: 26px;
    z-index: 2;
}
div#nav a {
    padding: 2px 3px;
    margin: 5px 7px;
    line-height: 26px;
}
body#home div#nav a.aleft {
    background: url('img/arrow-l.gif') no-repeat;
    width: 9px;
}
body#home div#nav a.aright {
    background: url('img/arrow-r.gif') no-repeat;
    width: 9px;
}
body#id div#nav a.aleft {
    background: url('img/arrow-l-b.gif') no-repeat;
    width: 9px;
}
body#id div#nav a.aright {
    background: url('img/arrow-r-b.gif') no-repeat;
    width: 9px;
}
body#present div#nav a.aleft {
    background: url('img/arrow-l-r.gif') no-repeat;
    width: 9px;
}
body#present div#nav a.aright {
    background: url('img/arrow-r-r.gif') no-repeat;
    width: 9px;
}
body#print div#nav a.aleft {
    background: url('img/arrow-l-p.gif') no-repeat;
    width: 9px;
}
body#print div#nav a.aright {
    background: url('img/arrow-r-p.gif') no-repeat;
    width: 9px;
}
body#web div#nav a.aleft {
    background: url('img/arrow-l-g.gif') no-repeat;
    width: 9px;
}
body#web div#nav a.aright {
    background: url('img/arrow-r-g.gif') no-repeat;
    width: 9px;
}
body#home div#nav a.aleft:hover, body#home div#nav a.aright:hover, body#id div#nav a.aleft:hover, body#id div#nav a.aright:hover, body#present div#nav a.aleft:hover, body#present div#nav a.aright:hover, body#print div#nav a.aleft:hover, body#print div#nav a.aright:hover,  body#web div#nav a.aleft:hover, body#web div#nav a.aright:hover {
    background-position: 0 -16px;
}
div#content {
    text-align: center;
}
div#show {
    margin: 60px 0 0 35px;
    text-align: left;
  font-size: 0;
}
div#show img, div#show a img {
width: 150px;    
height: 135px;
margin: 0;
    padding: 0;
    border: 0;
    text-decoration: none;
}
div#corn-t {
    margin: 0 auto;
    width: 486px;
    background: url('img/corn-t.gif') no-repeat;
}
div#corn-b {
    background: url('img/corn-b.gif') no-repeat 0 100%;
}
div#corn-t div#corn-b img {
    margin: 7px;
}
img#bigshow {
margin-right: 0px;
}

div.projekt {
  width: 100%;
    position: absolute;
    left: 0;
    top: 67px;
    z-index: 1;
  min-height: 1000px;
}
p.podpis {
font-weight: bold;
margin: 20px;
font-size: 11px;
}

style-ie.css
Kod
/* IE style */
div#nav a { line-height: 10px; }

Prosze o pomoc...
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 1)
jm.webmaster
post 29.11.2006, 22:26:40
Post #2





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 29.11.2006

Ostrzeżenie: (0%)
-----

Linki są zrobione z obrazków, które mają przeźroczyste tło. Niestety, jak plik jest z rozszerzeniem *.png (a tak chyba jest), to przeglądarka IE nie interpretuje tego jako transparent (jako przeźroczyste).
Co zrobić? Chyba najlepsze rozwiązanie polega na zapisaniu tych oprazków jako *.gif.


--------------------
Dobry programista poradzi sobie z ubogim językiem,
ale nawet najlepsze środowisko programistyczne nie uratuje słabego programisty.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Wersja Lo-Fi Aktualny czas: 24.07.2025 - 21:48
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn