Sich kreuzende Borders

Status
Nicht offen für weitere Antworten.
zyro

zyro

Mitglied
Hallo zusammen,

habt ihr sowas schonmal gesehen (siehe Anhang)?
Ich werde wahnsinnig Eigentlich sollte die rote-Linie ganz einfach unten sein, ist sie aber im Ie6 nicht.
Hat jemand ne Ahnung woran das liegen kann?

Hier der CSS Code:

HTML: 
#box-middle ul.reiterNav {
	margin:6px 0 0 0;
	padding:0;
}

#box-middle ul.reiterNav li {
	display:block;
	float:left;
	background-color:#0190d4;
	margin:0;
	padding:0;
	list-style-type:none;
	border:1px solid #fff;
	border-left:none;
	height:25px !important;
	height:27px;
}

#box-middle ul.reiterNav li a {
	display:block;
	float:left;
	height:18px;
	padding:5px  20px 0px 20px;
	margin:0;
	color:#fff;
	font-weight:bold;
}

#box-middle ul.reiterNav li.act {
	background-color:#fff;
}

#box-middle ul.reiterNav li.act a {
	height:20px;
	color:#0190d4;
	padding:5px 20px 0px 20px;
	font-weight:bold;
	margin:0;
	border:1px solid #0190d4;
	border-bottom:1px solid #ff3300;
}

P.S.: Das Workaround mit den Borders hat seinen Sinn, da muss später noch etwas verändert werden...
 

Anhänge

  • border.gif
    border.gif
    3 KB · Aufrufe: 20
Zuletzt bearbeitet:
Moin zyro,

Mmmh...irgendwie hab ich einen anderen IE als alle anderen...bei mir kreuzt sich da nichts :-)

Könntest du bitte mal den betreffenden HTML-Code und das komplette CSS posten?
 
Hi,

ich kann mich da nur Svens Aussage anschliessen, und mit dem hergeleiteten HTML-Quellcode deinen Schnappschuß nicht rekonstruieren:

demo_borders.jpg

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta name="author" content="Maik">
<title>tutorials.de | demo_zyro</title>

<style type="text/css">
<!--
#box-middle ul.reiterNav {
        margin:6px 0 0 0;
        padding:0;
}

#box-middle ul.reiterNav li {
        display:block;
        float:left;
        background-color:#0190d4;
        margin:0;
        padding:0;
        list-style-type:none;
        border:1px solid #fff;
        border-left:none;
        border-left:none;
        /*height:25px !important;*/ /* auskommentiert */
        height:27px;
}

#box-middle ul.reiterNav li a {
        display:block;
        float:left;
        height:18px;
        padding:5px  20px 0px 20px;
        margin:0;
        color:#fff;
        font-weight:bold;
}

#box-middle ul.reiterNav li.act {
        background-color:#fff;
}

#box-middle ul.reiterNav li.act a {
        height:20px;
        color:#0190d4;
        padding:5px 20px 0px 20px;
        font-weight:bold;
        margin:0;
        border:1px solid #0190d4;
        border-bottom:1px solid #ff3300;
}
-->
</style>


</head>
<body>

<div id="box-middle">
        <ul class="reiterNav">
            <li class="act"><a href="#">Rating</a></li>
            <li><a href="#">Contact</a></li>
        </ul>
</div>

</body>
</html>
In diesem Zusammenhang ist Stu Nicholls' Experiment Border Colors ganz interessant.

mfg Maik
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück