PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : <li> soll restlichen Splatz füllen wie ?


dadie
08.02.2005, 18:41
Hallo

Ich will gerade mal ne neue Webseite basteln dabei wollte ich das so aufbauen

Menu | home | menu


Mir kamm die IDEE das Per ul und li zu lösen :D
Naja aufeden fall siht mein code so aus :

css.css



A:link {text-decoration: none; color: #0000FF;}

A:visited{text-decoration: none; color: #0000FF;}

A:active{text-decoration: none; color: #000000;}

a:hover{text-decoration: underline; color: #0000FF;}

body {
margin-top:0px;
padding-top:0px;
margin-left:5px;
padding-left:5px;
margin-right:5px;
padding-right:5px;
margin-bottom:0px;
padding-bottom:0px;
}

table, th, tr, td, div, ul, li {
vertical-align: top;
}

.top {
background: #297AA3;
border-top: 0px #AEBDC4 solid;
border-left: 1px #000000 solid;
border-right: 1px #000000 solid;
border-bottom: 1px #000000 solid;
text-align:center;
color:#000000;
font-size:14px;
font-family: verdana,arial;
margin-bottom:1px;
}

.logo {
background: #297AA3;
border-top: 1px #000000 solid;
border-left: 1px #000000 solid;
border-right: 1px #000000 solid;
border-bottom: 1px #000000 solid;
text-align:center;
color:#000000;
font-size:12px;
margin-bottom:1px;
height:90px;
}






#pagename ul {
padding: 0;
margin: 0;
display:inline;
}



#pagename ul li {
display:inline;
list-style-type: none;
padding-left: 1px;
padding-right: 1px;
margin: 0;
}

.menu {
background: #297AA3;
border-top: 1px #000000 solid;
border-left: 1px #000000 solid;
border-right: 1px #000000 solid;
border-bottom: 1px #000000 solid;
text-align:center;
color:#000000;
font-size:13px;
margin-bottom:1px;
width:180px;
text-align:center;
}


.home {
background: #297AA3;
border-top: 1px #000000 solid;
border-left: 1px #000000 solid;
border-right: 1px #000000 solid;
border-bottom: 1px #000000 solid;
text-align:center;
color:#000000;
font-size:13px;
margin-bottom:1px;
text-align:center;
}



index.html



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<title>Untitled</title>
<link rel=stylesheet type="text/css" href="./css/css.css">

<script type="text/javascript">

<!--

function tick()
{
var hours, minutes, seconds;

var intHours, intMinutes, intSeconds;

var today;

today = new Date();

intHours = today.getHours();

intMinutes = today.getMinutes();

intSeconds = today.getSeconds();

hours = intHours+":";

if (intMinutes < 10) {minutes = "0"+intMinutes+":";}

else {minutes = intMinutes+":";}


if (intSeconds < 10) {seconds = "0"+intSeconds+" ";}

else {seconds = intSeconds+" ";}

timeString = hours+minutes+seconds ;


document.getElementById("Clock").firstChild.nodeValue=timeString;

window.setTimeout("tick();", 1000);



}

window.onload = tick;

//-->
</script>

</head>
<body>
<div class="top" style="" >Homepagename</div>
<div class="logo" style="" >&nbsp;</div>

<div class="pagename" id="pagename" >
<ul>
<li id="clock" class="menu" style="margin-right:1px;">&nbsp;</il>
<li class="home" style="width:100%;">&nbsp;</li>
<li id="date" class="menu" style="margin-left:1px;">&nbsp;</il>
</ul>
</div>

</body>
</html>



nur irgentwie macht der bei 100% ein <Br> und alles ist wieder untereinander :(


Grüsse. Dadie
dead_orc
08.02.2005, 18:43
Ich denke, dass das auch richtig ist: Das 2. <li> soll über die gesamte Bildschirmbreite gehen, also haben die beiden anderen links und rechts keinen Platz mehr!
dadie
08.02.2005, 18:46
Ich denke, dass das auch richtig ist: Das 2. <li> soll über die gesamte Bildschirmbreite gehen, also haben die beiden anderen links und rechts keinen Platz mehr!

Ja aber es loss nciht 100% vom Bildschrim vondern vom Restplatz füllen also 100% des freien Platzes.

Klar könnte ich das druch feste Grössen lösen doch dann würde die seite wieder nur auf einer auflösung Perfekt ausssehn :(
Geiu
08.02.2005, 18:53
Ja aber es loss nciht 100% vom Bildschrim vondern vom Restplatz füllen also 100% des freien Platzes.

Klar könnte ich das druch feste Grössen lösen doch dann würde die seite wieder nur auf einer auflösung Perfekt ausssehn :(
Probier mal

margin:0px auto;
(Auto bedeutet immer dass der Restplatz benutzt wird)
dadie
08.02.2005, 19:00
margin:0px auto;


Hilfe auch nicht :( vieleicht habe ich es auch nur flasch eingebaut ich habe es im .home
eingebaut.
Geiu
08.02.2005, 19:09
Vielleicht könnts dran liegen dass du statt </li> </il> geschrieben hast und dadurch die Renderengine durcheinanderkommt (habs erst jetzt gemerkt)
dadie
09.02.2005, 11:31
Vielleicht könnts dran liegen dass du statt </li> </il> geschrieben hast und dadurch die Renderengine durcheinanderkommt (habs erst jetzt gemerkt)

Nee daran liegt es auch nett
:(