CSS Code wird nicht übernommen

Status
Nicht offen für weitere Antworten.
A

alex130

Erfahrenes Mitglied
Hallo,
ich habe ein Problem und zwar, hab ich in ein fertiges Design einen div eingebaut, doch der CSS Code davon wird nicht übernommen...
Hier ist der Code:
styles_wiki.css:
HTML: 
#wiki_search {
width: 520px;
height: 55px;
}

#wiki_search_left {
width: 8px;
height:55px;
float:left;
background: url(../images/such_links.png);
}

#wiki_search_center {
background: url(../images/such_bg.png);
height:55px;
margin: 0 8px;
}

#wiki_search_right {
width: 8px;
height:55px;
float: right;
background: url(../images/such_rechts.png);
}

input.wiki_search {
height: 20px;
font-size: 12px;
padding: 3px 3px 3px 30px;
background: #fff url(../images/such_logo.png) no-repeat;
}

/* clearfix zum Aufheben der Floatumgebung */

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

#wiki_top {
width: 500px;
}

Und das ist der Code der im Browser ausgegeben wird, also der Quelltext:
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>domain.de</title>
<base href='http://domain.de/'>
<meta name="Revisit" content="After 1 days">
<meta name="Revisit-after" content="1 days">
<meta name="Robots" content="INDEX,FOLLOW">
<link href="../images/favicon.ico" rel="shortcut icon">
<link rel="stylesheet" href="./css/styles.css" title="stylesheet" type="text/css">
<link rel="stylesheet" href="./css/news.css" title="stylesheet" type="text/css">
<link rel="stylesheet" href="./css/styles_wiki.css" title="stylesheet" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript" src="./include/js/main.js"></script>
<script type="text/javascript" src="./include/js/jquery-1.2.2.pack2.js"></script>

</head>
<body><a name="top"></a><div class="top">
<a href="signup.php">Signup</a> | <a href="login.php">Login</a>
| <a href="help.php">Help</a> | <a href="http://news.domain.de">News</a> |   <a href="http://wiki.domain.de">Wiki</a>

</div>
<br><br>
<div align="center">
<div style="width:1024px">
<div align="left"><a href="http://domain.de"><img class="logo" src="images/logo.png" border="0"></a><br>
<img class="uuu" src="images/uuu3.png"><a href="http://domain.de" onmouseover="menue1.src='images/menue2_1_hover.png';menue2.src='images/menue2_home_hover.png';menue3.src='images/menue2_hover_double.png';" onmouseout="menue1.src='images/menue2_1.png';menue2.src='images/menue2_home.png';menue3.src='images/menue2_hover_right.png';"><img src="images/menue2_1.png" name="menue1"><img src="images/menue2_home.png" name="menue2"></a><img src="images/menue2_hover_right.png" name="menue3"><a href="http://news.domain.de"><img src="images/menue2_news_hover.png" name="menue5"></a><img src="images/menue2_hover_left.png" name="menue6"><a href="http://domain.de/partner.php" onmouseover="menue6.src='images/menue2_hover_double.png';menue7.src='images/menue2_partner_hover.png';menue8.src='images/menue2_hover_left.png';" onmouseout="menue6.src='images/menue2_hover_left.png';menue7.src='images/menue2_partner.png';menue8.src='images/menue2_no_hover.png';"><img src="images/menue2_partner.png" name="menue7" border="0"></a><img src="images/menue2_no_hover.png" name="menue8"><a href="http://domain.de/banner.php" onmouseover="menue8.src='images/menue2_hover_right.png';menue9.src='images/menue2_banner_hover.png';menue10.src='images/menue2_hover_left.png';" onmouseout="menue8.src='images/menue2_no_hover.png';menue9.src='images/menue2_banner.png';menue10.src='images/menue2_no_hover.png';"><img src="images/menue2_banner.png" name="menue9" border="0" /></a><img src="images/menue2_no_hover.png" name="menue10"><a href="http://wiki.domain.de" onmouseover="menue10.src='images/menue2_hover_right.png';menue12.src='images/menue2_hover_left.png';menue11.src='images/menue2_wiki_hover.png';" onmouseout="menue10.src='images/menue2_no_hover.png';menue12.src='images/menue2_no_hover.png';menue11.src='images/menue2_wiki.png';"><img src="images/menue2_wiki.png" name="menue11" border="0"></a><img src="images/menue2_no_hover.png" name="menue12"><a href="http://domain.de/faq.php" onmouseover="menue12.src='images/menue2_hover_right.png';menue13.src='images/menue2_faq_hover.png';" onmouseout="menue12.src='images/menue2_no_hover.png';menue13.src='images/menue2_faq.png';"><img src="images/menue2_faq.png" name="menue13" border="0"></a><div class="head">
<img src="images/news_header.png" />
</div>
<br />
<div class="newsbox">


<div id="wiki_search" class="clearfix" style="margin:9 auto;">
	<div id="wiki_search_left"></div>
    <div id="wiki_search_center">

        <form action="http://localhost/szene/wiki.php" method="POST">
            <input type="text" name="search" class="wiki_search" />
            <input type="submit" name="submit" value="Suchen" />
        </form>
	</div>
	<div id="wiki_search_right"></div>
</div>

<br /><br /><br />

</div>

<br />
<div class="foot">
<img src="images/news_foot.png" />
</div><br><br>
<a href="http://domain.de"><img src="http://img.domain.de/small_banner.gif" border="0" style="margin-right:5px ; margin-top:10px;"></a><a href="http://news.domain.de"><img src="http://img.domain.de/small_banner_news.gif" border="0" style="margin-right:5px ; margin-top:10px;"></a><a href="http://wiki.domain.de"><img src="http://img.domain.de/small_banner_wiki.gif" border="0" style="margin-right:5px ; margin-top:10px;"></a><a href="http://domain.de"><img src="http://img.domain.de/underground.gif" border="0" style="margin-right:5px ; margin-top:10px;">
</a><a href="http://domain.de">
<img src="http://img.domain.de/php.gif" border="0" style="margin-right:5px ; margin-top:10px;"></a>

<a href="http://validator.w3.org/check?uri=http%3A%2F%2Fdomain.de&charset=%28detect+automatically%29&doctype=Inline&group=0" target="_blank"><img src="http://img.domain.de/html.gif" border="0" style="margin-right:5px ; margin-top:10px;"></a>
<a href="http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fdomain.de%2Fcss%2Fstyles.css&profile=css21&usermedium=all&warning=0" target="_blank"><img src="http://img.domain.de/css.gif" border="0" style="margin-right:5px ; margin-top:10px;"></a>
<a href="http://domain.de"><img src="http://img.domain.de/rss.gif" border="0" style="margin-right:5px ; margin-top:10px;"></a><a href="http://domain.de/rss_news.php#top"><img src="http://img.domain.de/nachoben.png"></a>
</div>
</div>
</div>
<!--Bilder vorladen-->
<div style="display:none;">
<img src="images/menue2_1_hover.png" width="0" height="0">

<img src="images/menue2_home_hover.png" width="0" height="0">
<img src="images/menue2_hover_double.png" width="0" height="0">
<img src="images/menue2_partner_hover.png" width="0" height="0">
<img src="images/menue2_banner_hover.png" width="0" height="0">
<img src="images/menue2_wiki_hover.png" width="0" height="0">
<img src="images/menue2_faq_hover.png" width="0" height="0">
<img src="images/menue2_news_hover.png" width="0" height="0">
<img src="images/menue2_hover_right.png" width="0" height="0">

<img src="images/menue2_hover_left.png" width="0" height="0">
<img src="http://img.domain.de/minus.png" width="0" height="0">
</div>
</body>
</html>
Der komplette Code wird richtig dargestellt, außer der aus dem Div #wiki_search
Da sieht es so aus, als wäre kein Code deklariert...
 
Hi,

hier fehlt die Einheitenangabe, weshalb die Box nicht wie gewünscht im Viewport ausgerichtet wird:

Code: 
<div id="wiki_search" class="clearfix" style="margin:9px auto;">
mfg Maik
 
Tausch einfach mal die Reihenfolge, denn es werden im Markup immer zuerst die zu umfliessenden Elemente genannt:

Code: 
<div id="wiki_search_left"></div>
<div id="wiki_search_right"></div>
<div id="wiki_search_center">...</div>
mfg Maik
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück