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:

Lenke til kommentar

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
Lenke til kommentar
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
Lenke til kommentar

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...