Få navigations bar'n och lägga sig längst hela sidan.

Permalänk
Inaktiv

Få navigations bar'n och lägga sig längst hela sidan.

Som titeln säger så vill jag att min navigations bar ska ligga längst hela sidan.

Och jag vill ha den typ som googles navigations bar där det inte är något mellan rum i sidorna.

(uppe vid "Du+")

CSS Coden.

@charset "utf-8"; /* CSS Document */ #wrapper { margin:auto; max-width:1000px; max-height:1500px; } body { background-color:#e4e4e4; } #navigation_bar { background-image:url(gfx/background.png); background-repeat:repeat-x; height:83px; }

Permalänk
Medlem
Skrivet av Morpiha:

Lägg "top-baren" utanför wrapper,
sen ge den

class="top-bar"

css:

.top-bar{ position:absolute; top:0; margin:0; width:100%; height:30px; background:#000; }

Visa signatur

citera gärna så jag hittar tillbaka!

Permalänk
Inaktiv
Skrivet av Gardart:

Lägg "top-baren" utanför wrapper,
sen ge den

class="top-bar"

css:

.top-bar{ position:absolute; top:0; margin:0; width:100%; height:30px; background:#000; }

Tack så jätte mycket
Du råkar inte veta hur man får den att följa med hela sidan när man scrollar nedåt? Som typ på facebook.

Permalänk
Medlem
Skrivet av Morpiha:

Tack så jätte mycket
Du råkar inte veta hur man får den att följa med hela sidan när man scrollar nedåt? Som typ på facebook.

Använd position: fixed istället för position: absolute.

Permalänk
Inaktiv
Skrivet av You:

Använd position: fixed istället för position: absolute.

Men när jag använder position:fixed så blir det ett mellan rum sidans slut och navigation bar'n på vänster sida.

Edit: testade ta tillbaka till absolute och nu såg jag att det fortfarande är ett mellan rum även med absolute. Det är bara det att den scrollar åt sidan så det inte är något mellanrum längre O.o

Permalänk
Medlem
Skrivet av Morpiha:

Men när jag använder position:fixed så blir det ett mellan rum sidans slut och navigation bar'n på vänster sida.

Edit: testade ta tillbaka till absolute och nu såg jag att det fortfarande är ett mellan rum även med absolute. Det är bara det att den scrollar åt sidan så det inte är något mellanrum längre O.o

För att ha som facebook ska koden se ut såhär:

Topbaren ska ha position:absolute;

<div class="topbar">

</div>

<div class="content">
hej...
</div>

css:

body{
height:100%;
overflow:hidden;
}
.content{
height:100%;
padding-top:SAMMA SOM heighten på topbar;
overflow:scroll;
}

.topbar ska ha samma som jag Skrev förut

Visa signatur

citera gärna så jag hittar tillbaka!

Permalänk
Inaktiv

Asså fan..Den designen blev inget bra
Såg bra ut när jag började men sen blev det inte så snyggt.

Gjorde en ny design i photoshop snabbt.
Vad tycker ni om denna?

Om jag skulle få navigation bar'n att bli som det är på den bilden hur ska koden vara då?

Permalänk
Medlem
Skrivet av Morpiha:

Asså fan..Den designen blev inget bra
Såg bra ut när jag började men sen blev det inte så snyggt.

Gjorde en ny design i photoshop snabbt.
Vad tycker ni om denna?
http://oi43.tinypic.com/rbccp5.jpg

Om jag skulle få navigation bar'n att bli som det är på den bilden hur ska koden vara då?

Om du nu vill ha texten åt vänster som jag har fattat Så ocentrerar du den och skriver

Left 100

(100=antalet pixlar)
Scrollen vet jag dock inte. Sen kan jag ha fattat heeeeeeelt fel också

Visa signatur

Kom ihåg att ALLTID citera mig om du vill ha svar!

|CPU: Intel Core i7 4790K Kyld av: Corsair H80 GPU: ASUS GTX 970 4GB Chassi: Phanteks Enthoo Evolv MOBO: MSI Z97M Gaming Nätagg: XFX 750W Silver SSD: Kingston 120GB SSDNow V300 HDD: Samsung Spinpoint F3 1TB 7200RPM + 1TB|

Permalänk
Inaktiv
Skrivet av FobbanN:

Om du nu vill ha texten åt vänster som jag har fattat Så ocentrerar du den och skriver

Left 100

(100=antalet pixlar)
Scrollen vet jag dock inte. Sen kan jag ha fattat heeeeeeelt fel också

scrollen? :S