Gå til innhold

CSS; Problemer med meny

Hayer

Anbefalte innlegg

Hayer

Hayer

Skrevet
Skrevet

Hei :)

Har akkuratt startet å lære meg litt mer CSS, er helt n00b på det så koden er sikkert rotete osv, men hvis du åpner koden i IE å blar litt ned ser du fort hva som er problemet med menuRight som skal være på høyresiden av contentMain

 

Klikk for å se/fjerne innholdet nedenfor
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body{
background:#999999;
}

/*--------- Meny innstillinger --------------*/
div.menuLeft {
float:left;
background:#333333;
color:#999999;
width:200px;
height:500px;
margin-left:5px;
margin-right:12px;
border:1.7px solid black;
}

ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a
{
float:left;
width:160px;
text-decoration:none;
text-align:center;
color:white;
background-color:#333333;
padding:0.2em 0.6em;
border-rigth:1px solid #999999;
border-bottom:0.5px solid #999999;
border-top:1px solid #999999;
}

a:hover {background-color:#999999}
li {display:inline}
/*-----------------------------*/

/*--------- Midten, HOVED BOKSENE --------------*/
div.contentMain {
background:#333333;
color:#999999;
width:550px;
height:800px;
margin-left:12px;
margin-right:12px;
border:1.7px solid black;
}

div.contentMainNewsHeader {
background:#999999;
color:#333333;
text-align:center;
width:300px;
height:10px;
margin-left:12px;
margin-right:12px;
margin-top:15px;
}

div.contentMainNews {
background:#333333;
color:#999999;
width:350px;
border:1px solid #666666;
text-algin:left;
margin-left:5px;
margin-left:12px;
margin-right:12px;
}


/*------------------------------------------------------*/

/*--------------------- boksene på høyrse side (spons, etc) ---------- */
div.menuRight {
float:right;
background:#333333;
color:#999999;
width:200px;
height:500px;
border:1.7px solid black;
margin-right:762px;
}
</style>
</head>
<body>
<div class="menuLeft">
Menu Left!
<ul>
<li><a href="#">Test</a></li>
   <li><a href="#">Test #2</a></li>
</ul>
</div>



<div class="contentMain">
Main content<br />
Her kommer alt innholdet!!<br />
PS:Siden er under utvikling!
<div class="contentMainNewsHeader">Heading #1</div><br />
<div class="contentMainNews">Nyhet #1<br />Nyhet #1, linje #2</div>
</div>
<div class="menuRight">Menu Right!</div>
</body>
</html>

 

Skjønner ikke helt derre :blush:

Videoannonse

Videoannonse
Annonse
speedy6110

speedy6110

Skrevet
Skrevet (endret)
Hei :)

Har akkuratt startet å lære meg litt mer CSS, er helt n00b på det så koden er sikkert rotete osv, men hvis du åpner koden i IE å blar litt ned ser du fort hva som er problemet med menuRight som skal være på høyresiden av contentMain

 

Klikk for å se/fjerne innholdet nedenfor
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body{
background:#999999;
}

/*--------- Meny innstillinger --------------*/
div.menuLeft {
float:left;
background:#333333;
color:#999999;
width:200px;
height:500px;
margin-left:5px;
margin-right:12px;
border:1.7px solid black;
}

ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a
{
float:left;
width:160px;
text-decoration:none;
text-align:center;
color:white;
background-color:#333333;
padding:0.2em 0.6em;
border-rigth:1px solid #999999;
border-bottom:0.5px solid #999999;
border-top:1px solid #999999;
}

a:hover {background-color:#999999}
li {display:inline}
/*-----------------------------*/

/*--------- Midten, HOVED BOKSENE --------------*/
div.contentMain {
background:#333333;
color:#999999;
width:550px;
height:800px;
margin-left:12px;
margin-right:12px;
border:1.7px solid black;
}

div.contentMainNewsHeader {
background:#999999;
color:#333333;
text-align:center;
width:300px;
height:10px;
margin-left:12px;
margin-right:12px;
margin-top:15px;
}

div.contentMainNews {
background:#333333;
color:#999999;
width:350px;
border:1px solid #666666;
text-algin:left;
margin-left:5px;
margin-left:12px;
margin-right:12px;
}


/*------------------------------------------------------*/

/*--------------------- boksene på høyrse side (spons, etc) ---------- */
div.menuRight {
float:right;
background:#333333;
color:#999999;
width:200px;
height:500px;
border:1.7px solid black;
margin-right:762px;
}
</style>
</head>
<body>
<div class="menuLeft">
Menu Left!
<ul>
<li><a href="#">Test</a></li>
   <li><a href="#">Test #2</a></li>
</ul>
</div>



<div class="contentMain">
Main content<br />
Her kommer alt innholdet!!<br />
PS:Siden er under utvikling!
<div class="contentMainNewsHeader">Heading #1</div><br />
<div class="contentMainNews">Nyhet #1<br />Nyhet #1, linje #2</div>
</div>
<div class="menuRight">Menu Right!</div>
</body>
</html>

 

Skjønner ikke helt derre  :blush:

8898993[/snapback]

 

 

hmm eg ville heller gjort det sån som dette : 

<html>
<head>
<link rel="stylesheet" type="text/css " href="style.css">
må inn i style filen
<style type="text/css">
#div_nav
{
width:1100px;
height:800px;
}
#div_left
{
float:left;
margin-left:10px; eller hva du skal ha ... fra siden 
}
#div_content
{
float:left;
}
#div_right
{
float:left;
}
og mer instillinger om du trenger det om høyden osv 
</style>

<!--bruk alt fra css stlyen din og inn i egen style.css fil alt blir bedre da ..-->
<title>hjemmesiden</title>
</head>
<body>
<div id="nav">
<div id="div_left">
LEFT her kan det kommer mer div vis du har som nyheter osv
</div> 
<div id="content">
 CENTER her kan det kommer mer div vis du har som nyheter osv 
</div>
<div id="right">
 her kan det kommer mer div vis du har som nyheter din elelr hva 
</div>
</div>

</body>
</html>

 

 

Skjønner du ?? du lage en ramme runt der du får LEFT og CENTER

men dette e en måte eg har gjort til nå..finst mange måte der ute ..vet ikkje om folk her e enig med meg om dette :ermm:

Endret av speedy6110
speedy6110

speedy6110

Skrevet
Skrevet (endret)
Så alt som står over LEFT er til venstre eller? :s

8899919[/snapback]

Ja nå ahr eg opptatert posten over litt at nå ahr du :

 

LEFT CENTER RIHGT

__ _____ ____

__ _____ ____

__ _____ ____

 

 

slutt på siden

 

Få å få den i center hele NAV meny som e selven rammen så må du bruke margin-lef:px du trenger få den i center; i... dette skal plaseres i #div_nav i CSS filen eg sa du skulle lage og abre linke til CSS filen.

 

 

Skjønner du litt bedre ??

Endret av speedy6110

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste

  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...