Det blev tok, hoppas du ändå ser vart mina svar finns...
försa försökter med CSS layout
116 svar · 2 412 visningar · startad av ptr_lks · sida 3 av 6
Frågan, av ptr_lks
Hej, har gjort mitt första försök med 3 raders layout i CSS. Får inte till det, så hoppas på er hjälp :) 1. ett hack för att det skall se lika bra ut i ie/ff/netscape 2. minska a på ie.gif 3. minska b på ie.gif 4. få .menu innanför ramen (centrera) 5. positionering av h3 6. positionering av brödtext 7. minska e på ffochNetscape.gif 8. öka lite f på ffochNetscape.gif gärna med en liten förklari
Läs frågan i sin helhet →Försöker lägga till en fot
#fot {
width: 742px;
height:auto;
color:#006;
}
#fot p {
text-align:left;
color:#FFF;
padding: 5px 0 0 0;
}
<div id="fot"><p>Webmaster</p></div></div>
Men jag får ej att funka, dvs fotnoten syns inte
Bifogar hela koden
Du har angett color två gånger där den vita som angetts sist tar över.
Jag gissar att du ville ha mörkblå bakgrund och vit text så då får du skriva background i #fot
tanten skrev:
Du har angett color två gånger där den vita som angetts sist tar över.
Jag gissar att du ville ha mörkblå bakgrund och vit text så då får du skriva background i #fot
stämmer bra :r
Nu har jag ändratändrat
- hur får jag större vit fält i IE?
- ser mysko ut i FF
- - hur får jag det hela rätt?
Antingen ger du en bestämd höjd på content eller använder padding-bottom.
Om det bara är på just denna sida som du vill ha t.ex mer vitt under det sista ordet så kan du skriva in paddin-bottom eller margin-bottom i den diven, som den ligger i
Vad är det som ser mysko ut i FF?
Vill ha på alla mina sidor..
Nu har jag försökt laborera med x i
height X%;
Utan någon förändring
Jag gör en printscreen av ff och skickar med. Vill ju ha fotnoten (#fot) längst ned på sidan
X ???
Kom på att conten omsluter ju även "fot så det är #text du ska lägga in en padding på...
Usch för mig
Eller?
Om du uppdaterar din länk efter hand som du jobbar så jag ser felen och behöver inte gissa.
tanten skrev:
X ???
Kom på att conten omsluter ju även "fot så det är #text du ska lägga in en padding på...
Usch för mig
Ja, med X innebär jag att jag har försökt med olika procentsiffror på
#content {height: }
utan framgång dock :(
- i IE är #content alldels för "låg"
- i FF är content alldeles för hög, så att man måste rulla ner för att set fotnoten
Se den uppdaterade länken
Om det är länken där uppe som gäller nu så ser jag ingen större skillnad. Får scrolla i båda lite lite grann och de ser ungefär likadana ut.
Så jag vet inte
tanten skrev:
Om det är länken där uppe som gäller nu så ser jag ingen större skillnad. Får scrolla i båda lite lite grann och de ser ungefär likadana ut.
Så jag vet inte
Vet inte om det är fel på min dator, men jag tycker iaf att det är väldigt stor skillnad. Jag får som på de bifogade bilderna
Ligger den sidan på nätet eller?
Om du nu har Firefox så finns det en riktigt finurlig liten plug-in som jag alltid använder
Web Developer 0.9.4 som kan hämtas här: https://addons.mozilla.org/extensions/moreinfo.php?id=60
När du installerat den så har du möjlighet att köra "edit css" redigera din stilmall och se resultatet direkt på skärmen. Detta är ett jättebra sätt att "leka" med sin css-kod tills man är nöjd, sedan är det bara att kopiera och klistra in slutresultatet i den ursprungliga css-filen. Om du sedan klickar på "Outline" Outline Block Level Elements så får du en uppfattning om hur dessa element ligger på din sida.
Hoppas att detta kan hjälpa dig, för mig har det varit till stor hjälp i inlärningsprocessen ;)
Det märkliga är att de fortfarande ser likadana ut i min dator. Jag lyckas kanske inte få bort cach-minnet...
Men jag ser att du angett väldigt konstiga height i både #text och #content.
De påverkas av sitt innehåll så du kan egentligen ta bort dem så länge.
Om du också tar bort padding-top i #text så ser du precis hur stort vitt område du har. Då kommer allt att åka upp, även foten
Pluginen som Webbebba pratar om är jättebra till mycket, förutom att leka med css.
Jag släcker ner datorn nu och ser om cachen vill försvinna.
nu har jag installerat Pluginen som Webbebba föreslog, och hittade att om jag ändrar min-heigt
#container {
width: 742px;
min-height: [B]95[/B]%;
margin:0 auto;
background-color:#FFFFFF;
text-align:left;
}
så slipper jag scrolla iaf i Firefox, men det löser inte problemet i IE
Dessutom upptäckte jag "outline" att #fot inte var centrerad. Jag lyckades lösa detta genom
#fot {
width: 742px;
margin-right: auto;
margin-left: auto;
background-color:#006;
}
tog bort heighten som förslaget var, dock ingen förbättring i IE
ser fortfarande ungefär likadana ut hos mig...
tanten skrev:
ser fortfarande ungefär likadana ut hos mig...
fattar inte vad felet kan vara...
Däremot har jag med hjälp av insticket gjort så att det blev lite mer luft
Genom att lägga till padding i
#text p, #text ul{
text-align:center;
padding: 5px 0 5px 0;
}
löser just inte problemen, men qul att lära sig...
Nu ser det ungefär likadant ut i bägge webbläsarna. Det gjorde det inte innan.
webbebba skrev:
Nu ser det ungefär likadant ut i bägge webbläsarna. Det gjorde det inte innan.
då är det min tur att stänga av datorn... återkommer efter omstart :OO