Trädvy Permalänk
Medlem
Registrerad
Mar 2004

Problem lösning!

Hejsan!
Nu har jag uppgraderat www.Kistakliniken.se och har lagt till en div på högersidan ut av hemsidan (samarbetes div) och det kluriga med det hela nu är att den syns endast på vissa användare, vissa ser den och vissa ser den ej, ungefär 90% om inte fler ser den helt klart med firefox men via IE så ser inte så många den, det varierar. Är det någon som kan hjälpa mig med en lösning?

Inställningar jag testat och försökt leka mig fram med är dessa i *.css filen

#sponsorcontainer {
background-image: url('storage/image/teams.png');
width: 200px;
height: 500px;
position: inherit;
margin-left: 780px;
z-index: 1;
}

Sen kan ni kolla i HTML källkoden på sidan hur det är uppbyggt ifall det kan också vara en orsak varför den ej syns i IE.. För mig syns den dock i IE och FF men inte för alla andra, som jag påstod tidigare så varierar det från användare till användare

Tacksam för svar! ha en trevlig fortsatt sommar

Trädvy Permalänk
Medlem
Plats
i din garderob
Registrerad
Sep 2007

Hur kommer det sig att du satt en table runt layout diven?

Hursomhelst, sätt "position: relative" på #layout. på #sponsorcontainer sätter du:

#sponsorcontainer { background-image: url('storage/image/teams.png'); width: 200px; height: 500px; position: absolute; top: 0; right: 0; margin-right: -206px; }

Bilanaloger är som Volvo — varenda svenne kör med dem

Trädvy Permalänk
Medlem
Registrerad
Mar 2004
Citat:

Ursprungligen inskrivet av Teknocide
Hur kommer det sig att du satt en table runt layout diven?

Hursomhelst, sätt "position: relative" på #layout. på #sponsorcontainer sätter du:

#sponsorcontainer { background-image: url('storage/image/teams.png'); width: 200px; height: 500px; position: absolute; top: 0; right: 0; margin-right: -206px; }

Grymt, måste kolla ifall någon nu kan testa och se ifall det fungerar för att det fungerar för mig oavsätt.

Kan du förklara lite vad du gjort så jag lär mig för framtida skäl?

EDIT: jag visste inte hur man centrerade en DIV, men lärt mig att de räcker med

<div align="center"> så slipper man en tabell !

Trädvy Permalänk
Medlem
Plats
i din garderob
Registrerad
Sep 2007
Citat:

Ursprungligen inskrivet av DiscoJet
Grymt, måste kolla ifall någon nu kan testa och se ifall det fungerar för att det fungerar för mig oavsätt.

Kan du förklara lite vad du gjort så jag lär mig för framtida skäl?

EDIT: jag visste inte hur man centrerade en DIV, men lärt mig att de räcker med

<div align="center"> så slipper man en tabell !

"position: absolute" på ett element låter dig placera det relativt till närmaste förälderelement som har "position: relative", eller <body> om inget sådant förekommer. Man använder då top, left, bottom och right för att ange avståndet från respektive hörn.

I detta fallet blir #sponsorcontainer relativ till #layout och sätts till dess övre högra hörn. Sedan används en negativ högermarginal för att dra vidare elementet åt höger med 206px, 200 för dess bredd och 6 för att skapa lite mellanrum. Man hade kunnat ange "right: -206px" direkt men resultatet hade inte blivit exakt samma; jag föredrar negativ marginal.

För att centrera en div räcker det att sätta "margin: 0 auto" på den i CSSen.

Bilanaloger är som Volvo — varenda svenne kör med dem

Trädvy Permalänk
Medlem
Plats
Uppsala
Registrerad
Okt 2007
Citat:

Ursprungligen inskrivet av DiscoJet
EDIT: jag visste inte hur man centrerade en DIV, men lärt mig att de räcker med

<div align="center"> så slipper man en tabell !

HTML ska egentligen inte användas till design, det sköter CSS om. Men ett litet väl fungerande fulknep är att sätta text-align: center; på parent-diven, och sedan ställa tillbaks det i den centrerade diven.

<div id="parentDiv" style="text-align: center;"> <div id="centreradDiv" style="text-align: left;"> </div> </div>

Trädvy Permalänk
Medlem
Registrerad
Mar 2004
Citat:

Ursprungligen inskrivet av Teknocide
"position: absolute" på ett element låter dig placera det relativt till närmaste förälderelement som har "position: relative", eller <body> om inget sådant förekommer. Man använder då top, left, bottom och right för att ange avståndet från respektive hörn.

I detta fallet blir #sponsorcontainer relativ till #layout och sätts till dess övre högra hörn. Sedan används en negativ högermarginal för att dra vidare elementet åt höger med 206px, 200 för dess bredd och 6 för att skapa lite mellanrum. Man hade kunnat ange "right: -206px" direkt men resultatet hade inte blivit exakt samma; jag föredrar negativ marginal.

För att centrera en div räcker det att sätta "margin: 0 auto" på den i CSSen.

Tusen tack nu förstår jag lite mer hur man använder positioning ännu bättre.

Det finns så många knep att centrera en div. Det jag skrev fungerar ju också men vilken metod som är bäst vet jag inte iallafall,

Citat:

Ursprungligen inskrivet av Apro
HTML ska egentligen inte användas till design, det sköter CSS om. Men ett litet väl fungerande fulknep är att sätta text-align: center; på parent-diven, och sedan ställa tillbaks det i den centrerade diven.

code:--------------------------------------------------------------------------------
<div id="parentDiv" style="text-align: center;">
<div id="centreradDiv" style="text-align: left;">
</div>
</div>

Tack för ditt svar också, så som jag nämnde de finns ju tusen knep för centreringen

Trädvy Permalänk
Medlem
Plats
Göteborg
Registrerad
Jan 2007
Citat:

Ursprungligen inskrivet av Apro
HTML ska egentligen inte användas till design, det sköter CSS om. Men ett litet väl fungerande fulknep är att sätta text-align: center; på parent-diven, och sedan ställa tillbaks det i den centrerade diven.

<div id="parentDiv" style="text-align: center;"> <div id="centreradDiv" style="text-align: left;"> </div> </div>

Usch! Hemskt!
För det första, inline-styles är dåligt. För det andra, det där fulhacket borde inte fungera, då text-align inte ska påverka blockelement.

Gör så här, det är den accepterade lösningen:

CSS: .center{ margin: 0 auto; } HTML: <div class="center">...</div>

Trädvy Permalänk
Medlem
Plats
i din garderob
Registrerad
Sep 2007

Håller med föregående talare, men jag tycker det är bättre att sätta margin på ett ID just för att frigöra HTML:en så mycket som möjligt.

Bilanaloger är som Volvo — varenda svenne kör med dem

Trädvy Permalänk
Medlem
Plats
Uppsala
Registrerad
Okt 2007

Ojdå, jag glömde visst delen med margin: 0 auto;
Det är det bästa sättet att göra det på, men jag har för mig att det inte fungerar på IE6, därför brukar jag backa upp med text-align: center; etc...

Citat:

Ursprungligen inskrivet av You
Usch! Hemskt!
För det första, inline-styles är dåligt

Jag orkade helt enkelt inte skriva en separat del för css, använder nästan aldrig inline-styles när jag annars kodar

Trädvy Permalänk
Medlem
Registrerad
Mar 2004
Citat:

Ursprungligen inskrivet av You
Usch! Hemskt!
För det första, inline-styles är dåligt. För det andra, det där fulhacket borde inte fungera, då text-align inte ska påverka blockelement.

Gör så här, det är den accepterade lösningen:

CSS: .center{ margin: 0 auto; } HTML: <div class="center">...</div>

Din lösning såg riktigt lovande ut men den verkar tydligen inte fungera för mig.

HTML:

<body>
<div class="center">
<div id="topmenu">
</div>
</div>
</body>

CSS:

/* ID CLASSSES */

#topmenu {
background-color: #FFFFFF;
width: 600px;
height: 100px;
}

/* DIV CLASS */

.center{ margin: 0 auto; }

i HTML koden har jag testat även att stänga själva divklassen på olika sett men icke sa nicke !

Trädvy Permalänk
Medlem
Plats
Uppsala
Registrerad
Okt 2007

Du måste sätta en width på .center, annars kommer den alltid ta upp 100% och förstöra centreringen.

Fast det lättaste är egentligen att ta bort .center-diven helt och bara sätta margin: 0 auto; på #topmenu istället.

Trädvy Permalänk
Medlem
Registrerad
Mar 2004
Citat:

Ursprungligen inskrivet av Apro
Du måste sätta en width på .center, annars kommer den alltid ta upp 100% och förstöra centreringen.

Fast det lättaste är egentligen att ta bort .center-diven helt och bara sätta margin: 0 auto; på #topmenu istället.

Men då kan jag inte ställa in marginerna längre som t ex margin-top !

Trädvy Permalänk
Medlem
Plats
Göteborg
Registrerad
Jan 2007
Citat:

Ursprungligen inskrivet av DiscoJet
Men då kan jag inte ställa in marginerna längre som t ex margin-top !

Jodå.

.center{ margin: 1em auto; margin-top: 4em; }

Trädvy Permalänk
Medlem
Registrerad
Mar 2004
Citat:

Ursprungligen inskrivet av You
Jodå.

.center{ margin: 1em auto; margin-top: 4em; }

Konstigt jag fick sitta och knep o knåpa lite, irriterande, jag kan inte ställa in alla mina divvar som jag vill de knasar, antingen så är jag kass på att koda eller så skriver jag bara fel och i fel ordning och stänger divvarna fel osv