|
| kolonner med CSS giver problem i Firefox Fra : Brian Bendtsen |
Dato : 12-09-06 08:35 |
|
Hej liste
Jeg forsøger med css at lave følgende layout, som skal være centreret i
browseren.
____________________
|container |
| |--------------| |
| |header | |
| |----|----|----| |
| |k1 |k2 |k3 | |
| | | | | |
| |----|----|----| |
| |bund | |
| |--------------| |
|__________________|
Derfor er hele layoutet omkredset af <div id="container"></div>
#container {
width: 989px;
height: 100%;
margin: 0px auto;
text-align: center;
border: 1px solid #000;
}
Mine kolonner skaber jeg med 3 divs:
#k1, #k2, #k3 {
float: left;
width: 300px;
padding: 0px;
margin: 10px;
}
men min "float: left;" giver problemer i Firefox og layoutet kommer til
at se således ud:
____________________
|container |
| |--------------| |
| |header | |
|__________________|
|k1 |k2 |k3 |
| | | |
|----|----|----|
|bund |
|--------------|
Min kolonner hopper altså ud af min container.
Nogen der kan give en løsning på dette?
mvh. Brian Bendtsen
| |
Jens Gyldenkærne Cla~ (12-09-2006)
| Kommentar Fra : Jens Gyldenkærne Cla~ |
Dato : 12-09-06 08:38 |
|
Brian Bendtsen skrev:
> men min "float: left;" giver problemer i Firefox og layoutet
> kommer til at se således ud:
[snip]
Har du et link til siden?
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen
| |
Brian Bendtsen (12-09-2006)
| Kommentar Fra : Brian Bendtsen |
Dato : 12-09-06 08:58 |
|
Jens Gyldenkærne Clausen wrote:
> Brian Bendtsen skrev:
>
>
>>men min "float: left;" giver problemer i Firefox og layoutet
>>kommer til at se således ud:
>
>
> [snip]
>
> Har du et link til siden?
Kan jeg sende det til dig privat?
Mvh. Brian Bendtsen
| |
Jens Gyldenkærne Cla~ (12-09-2006)
| Kommentar Fra : Jens Gyldenkærne Cla~ |
Dato : 12-09-06 09:40 |
|
Brian Bendtsen skrev:
>> Har du et link til siden?
> Kan jeg sende det til dig privat?
Nej. Hvis jeg skal hjælpe pr. mail, bliver det med regning - og
ikke lige med det første.
Send hellere et link til gruppen, så kan alle være med til at
hjælpe. Hvis der er følsomme oplysninger på siden, kan du evt.
udskifte teksten med mumletekst.
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen
| |
Brian Bendtsen (12-09-2006)
| Kommentar Fra : Brian Bendtsen |
Dato : 12-09-06 09:52 |
|
Jens Gyldenkærne Clausen wrote:
> Brian Bendtsen skrev:
>
>
>>>Har du et link til siden?
>
>
>>Kan jeg sende det til dig privat?
>
>
> Nej. Hvis jeg skal hjælpe pr. mail, bliver det med regning - og
> ikke lige med det første.
>
> Send hellere et link til gruppen, så kan alle være med til at
> hjælpe. Hvis der er følsomme oplysninger på siden, kan du evt.
> udskifte teksten med mumletekst.
Ok, så kommer der et link her:
http://nytdesign.mentor-it.dk/fileadmin/templates/template-test.htm
Jeg har sat border på container og menu-1, som der er også er prob. med
i firefox, kan ikke få den højrestillet.
/Brian Bendtsen
| |
Jens Gyldenkærne Cla~ (12-09-2006)
| Kommentar Fra : Jens Gyldenkærne Cla~ |
Dato : 12-09-06 10:06 |
|
Brian Bendtsen skrev:
> http://nytdesign.mentor-it.dk/fileadmin/templates/template-test
> .htm
>
> Jeg har sat border på container og menu-1, som der er også er
> prob. med i firefox, kan ikke få den højrestillet.
Problemet med menuen er simpelt - du forsøger at højrestille en
blok (div#menu-1) med text-align - det er forkert. Når IE viser det
højrestillet er det kun fordi din xml-erklæring sætter IE i
quirksmode (det er bl.a. derfor en dårlig ide at bruge xml-
erklæringen - se evt.
< http://www.hintzmann.dk/articles/doctype/#ikke_xmldeklaration>)
Sæt float: right på #menu-1, så kommer den på plads i FF.
Problemet med #content er at du kun har floatet indhold i boksen,
og der ikke er defineret højde på noget af indholdet. I sådanne
situationer lader FF den omgivende boks (#content) få højden 0, og
indholdet flyder bare ud over boksen. Jeg kan ikke huske om det er
en fejl i FF, men du kan i hvert fald løse problemet ved at
indsætte et element med clear: left efter de tre bokse i #content.
NB: Husk at alle ikke har hvid som standard baggrundsfarve i
browseren.
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen
| |
Brian Bendtsen (12-09-2006)
| Kommentar Fra : Brian Bendtsen |
Dato : 12-09-06 10:44 |
|
Jens Gyldenkærne Clausen wrote:
> Brian Bendtsen skrev:
>
>
>> http://nytdesign.mentor-it.dk/fileadmin/templates/template-test
>>.htm
>>
>>Jeg har sat border på container og menu-1, som der er også er
>>prob. med i firefox, kan ikke få den højrestillet.
>
>
> Problemet med menuen er simpelt - du forsøger at højrestille en
> blok (div#menu-1) med text-align - det er forkert. Når IE viser det
> højrestillet er det kun fordi din xml-erklæring sætter IE i
> quirksmode (det er bl.a. derfor en dårlig ide at bruge xml-
> erklæringen - se evt.
> < http://www.hintzmann.dk/articles/doctype/#ikke_xmldeklaration>)
>
> Sæt float: right på #menu-1, så kommer den på plads i FF.
>
> Problemet med #content er at du kun har floatet indhold i boksen,
> og der ikke er defineret højde på noget af indholdet. I sådanne
> situationer lader FF den omgivende boks (#content) få højden 0, og
> indholdet flyder bare ud over boksen. Jeg kan ikke huske om det er
> en fejl i FF, men du kan i hvert fald løse problemet ved at
> indsætte et element med clear: left efter de tre bokse i #content.
>
> NB: Husk at alle ikke har hvid som standard baggrundsfarve i
> browseren.
Mange tak
Jeg har forsøgt at sætte en adresselinie ind i bunden og den ryger også
udenfor containeren.
Hvis jeg laver browservinduet meget lille i IE kan man ikke browse ned
og se adresselinien.
mvh. Brian Bendtsen
| |
Jens Gyldenkærne Cla~ (12-09-2006)
| Kommentar Fra : Jens Gyldenkærne Cla~ |
Dato : 12-09-06 10:53 |
|
Brian Bendtsen skrev:
> Jeg har forsøgt at sætte en adresselinie ind i bunden og den
> ryger også udenfor containeren.
Slet position: relative - så hopper den på plads.
Hvad er i øvrigt grunden til at anvende position: relative så mange
steder?
NB: Du må gerne klippe lidt i dine citater.
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen
| |
Brian Bendtsen (12-09-2006)
| Kommentar Fra : Brian Bendtsen |
Dato : 12-09-06 11:09 |
|
Jens Gyldenkærne Clausen wrote:
> Brian Bendtsen skrev:
>
>
>>Jeg har forsøgt at sætte en adresselinie ind i bunden og den
>>ryger også udenfor containeren.
>
>
> Slet position: relative - så hopper den på plads.
>
> Hvad er i øvrigt grunden til at anvende position: relative så mange
> steder?
>
> NB: Du må gerne klippe lidt i dine citater.
Hej
Det ved jeg ikke, er rimelig ny når det kommer til at lave layouts kun
ved brug af css, jeg synes jeg har store problemer med at få tingene til
at se ens ud i IE og FireFox.
Jeg bruger position: relative til at placere mine div-tags, er der en
bedre metode? har prøvet padding, men de 2 browsere reagere
tilsyneladende heller ikke ens på denne.
/Brian Bendtsen
| |
Jens Gyldenkærne Cla~ (12-09-2006)
| Kommentar Fra : Jens Gyldenkærne Cla~ |
Dato : 12-09-06 11:14 |
|
Brian Bendtsen skrev:
> Det ved jeg ikke, er rimelig ny når det kommer til at lave
> layouts kun ved brug af css, jeg synes jeg har store problemer
> med at få tingene til at se ens ud i IE og FireFox.
Prøv at slette xml-erklæringen som nævnt tidligere - så vil de
opføre sig mere ensartet (dog skal du så tjekke visningen i IE5.x
som herefter kan være anderledes).
> Jeg bruger position: relative til at placere mine div-tags, er
> der en bedre metode?
Ja. Positionering skal anvendes med omtanke - og ikke bare til at
skubbe diverse elementer på plads.
> har prøvet padding, men de 2 browsere
> reagere tilsyneladende heller ikke ens på denne.
Margen og padding er de primære egenskaber der skal justeres på.
Når IE er i standardmode, tolkes egenskaberne som udgangspunkt på
samme måde som i FF og Opera m.fl. I quirksmode (som du tvinger IE
i nu), er der større forskelle.
--
Bolig søges. Andel eller leje i Emdrup, Nordvest, Nørrebro, Søborg
eller Brønshøj, max 6000 pr. måned.
Kontakt pr. mail - nospam(at)gyros.dk
Jens Gyldenkærne Clausen
| |
|
|