Kodning för meny på snedden

[Spider84]

Jag har lite krångel med en meny som ska vara på snedden så här:

Sidan är upplagd ungefär så som det ser ut, en ruta i mitten med allt innehåll och så lite glapp runt om.

Det kommer ligga text m.m. vid menyn som jag vill ska forma sig snyggt efter menyn.
Skit enkelt...trodde jag. Jag lyckas inte hur jag än försöker. Någon som har förslag.

Försökte sist med position: absolute; men då tolkar IE och FF det olika. Den ena lägger den längst upp i vänster hörn och den andra längst upp i vänster hörn på själva sidans ruta (textrutan)...skit kul.

 

[Kuckeliku]

Sv: Kodning för meny på snedden

Du får helt enkelt göra så att du har olika kod för ie och för resten.
Har använt ett skript som gör det och sedan så kan jag använda samma skript för resten.
Är ganska vanligt vad jag fårstått, då ie och ff har helt olika syn på hur css och html skall tydas (vilket är lustigt med tanke på att det är standarder)

 

[Kuckeliku]

Sv: Kodning för meny på snedden

på http://techpatterns.com/downloads/php_browser_detection.php kan du hitta mer info.

 

[moiran]

Sv: Kodning för meny på snedden

För att få texten att snällt flyta runt menyn, använd float och marginaler. För att positionera beror det lite på hur omgivningen ser ut. Är innehållsrutans höjd fast är det ju bara att positionera (relativ positionering är det du vill använda). Är höjden inte fast får du utnyttja ett javascript för att positionera i botten på rutan.

 

[moiran]

Sv: Kodning för meny på snedden

Inte så lustigt. IE gör fel. De följer inte standarden. MS har ju alltid varit så vana vid att standarderna rättar sig efter dem och inte tvärt om. Men det är på bättringsvägen.

 

[Spider84]

Sv: Kodning för meny på snedden

Jag och javascript är inte kompisar kan jag säga på en gång.

Om jag nu använder position: relative...hur får jag den att lägga sig så där på snedden? Lägger in marginaler från höger sidan?

 

[Spider84]

Sv: Kodning för meny på snedden

Det funkar bättre med relative än absolute (big surprise) så tack för det tipset.

Men jag får fortfarande problemet att de blir relativa till varandra och inte "textrutan" de ligger i...vilket innebär att den första hamnar rätt och den andra hamnar alldeles för långt in på sidan. Jag vill ha den halvvägs under den första.

Kodningen ser ut så här nu:

#first {
display: block;
position: relative;
float: right;
margin-right: 10px;
margin-top: 20px;
width: 150px;
height: 69px;
background: none;
}

#first a:hover {
display: block;
width: 150px;
height: 69px;
background: url(knapp4.gif);
}

#second {
display: block;
position: relative;
float: right;
margin-right: 10px;
margin-top: 80px;
width: 150px;
height: 69px;
background: none;
}

#second a:hover {
display: block;
width: 150px;
height: 69px;
background: url(knapp4.gif);
}

Där länkarna har varsin div id="first (eller) second"


Några goda råd?

 

[Spider84]

Sv: Kodning för meny på snedden

Moiran? Eller någon annan som har en gissning?

 

[moiran]

Sv: Kodning för meny på snedden

Du kör ju med float, du kanske måste köra clear: right för att den inte ska lägga sig brevid den förra? (Jag har inte kollat så noga på din kod eller kontrollerat hur den uppför sig, jag har inte riktigt tid nu. Så det är bara en ren gissning. Kanske i helgen. )

 

[Spider84]

Sv: Kodning för meny på snedden

Tack det löste det problemet!!


Meeeen.
Texten hamnar uppe i vänster hörn, som den ju normalt gör, hur flyttar jag på den? Den ska några pixlar ned och några pixlar till höger. Centrera den fungerar inte för bilden den ligger på är inte gjord sån.

 

[moiran]

Sv: Kodning för meny på snedden

vilken text? padding?

 

[Spider84]

Sv: Kodning för meny på snedden

Jag har ju länk text som när de int eär hover bara ligger som understruken, sedan när man tar hover så kommer det en bild under texten. Länktexten måste du vara flyttad lite gentemot den bilden.

Jo padding, men var? Kan inte lägga den på det jag kodat nu för då flyttar jag hela bilden tillsammans med länken.