/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
2 skud fra hoften : css position og clear
Fra : Simon Hansen


Dato : 22-04-08 13:23

Hej gruppe

Sidder stadig og leger med at styre css.
Jeg er rendt ind i et mindre problem med IE 7. Samt højde på min
baggrunds blomst.

1: IE7- Som i kan se hvis i ser siden i IE vs opera/FF så bliver
baggrunden skubbet ud over kanten af IE?? Har selv en mistanke om at det
skyldes min clear:right i mine 2 blomster i venstre side. Men alligevel
undrer det mig en hulsens masse, da jeg jo har bestemt bredden af min
container til 680px. Så den burde vel bare blive "klippet" over hvis den
ryger forbi kanten? ihvertfald burde det ikke se sådan ud. Er det et
specielt IE "hack" man skal bruge for at få den ind på plads som i de 2
andre browsere? eller har jeg bare grundlæggende gjort det forkert?

2: Den nederste baggrundsblomt kan jeg ikke få til at makke ret i
højden, medmindre jeg giver den en bestemt højde.. kan ikke få den til
at stoppe når div'en stopper? altså få min div's højde bestemt af tekst
indholdet. igen skaber det problemer i IE med teksten (af en eller anden
grund) da IE af uvisser årsager har en større margin på tekst end de 2
andre?
Hvordan kan jeg få det billede til at stoppe ved tekst stoppet? (hvis
noget sådanne kan lade sig gøre)

Hilsen
Simon


 
 
Simon Hansen (22-04-2008)
Kommentar
Fra : Simon Hansen


Dato : 22-04-08 13:23

glemte lige linket http://home20.inet.tele.dk/xqual/

Simon Hansen skrev:
> Hej gruppe
>
> Sidder stadig og leger med at styre css.
> Jeg er rendt ind i et mindre problem med IE 7. Samt højde på min
> baggrunds blomst.
>
> 1: IE7- Som i kan se hvis i ser siden i IE vs opera/FF så bliver
> baggrunden skubbet ud over kanten af IE?? Har selv en mistanke om at
> det skyldes min clear:right i mine 2 blomster i venstre side. Men
> alligevel undrer det mig en hulsens masse, da jeg jo har bestemt
> bredden af min container til 680px. Så den burde vel bare blive
> "klippet" over hvis den ryger forbi kanten? ihvertfald burde det ikke
> se sådan ud. Er det et specielt IE "hack" man skal bruge for at få den
> ind på plads som i de 2 andre browsere? eller har jeg bare
> grundlæggende gjort det forkert?
>
> 2: Den nederste baggrundsblomt kan jeg ikke få til at makke ret i
> højden, medmindre jeg giver den en bestemt højde.. kan ikke få den til
> at stoppe når div'en stopper? altså få min div's højde bestemt af
> tekst indholdet. igen skaber det problemer i IE med teksten (af en
> eller anden grund) da IE af uvisser årsager har en større margin på
> tekst end de 2 andre?
> Hvordan kan jeg få det billede til at stoppe ved tekst stoppet? (hvis
> noget sådanne kan lade sig gøre)
>
> Hilsen
> Simon
>

David Nielsen (22-04-2008)
Kommentar
Fra : David Nielsen


Dato : 22-04-08 15:00

Du skulle prøve og gå ind på : http://www.w3schools.com

Også vælge LEARN CSS ude til venstre

Så har du eksempler på hvordan du bruger alle mulige ting i CSS den side
bruger jeg tit.

Hvis du syns at IE ikke virker som du syns den skal gøre så har du sikkert
ret, det er en dårlig browser så hvis du skal have alt til at virke ens
også i IE så skal du lærer IE fejl eller bugs. når man tager højde for
browserens fejl så kaldes det en fix.

F.eks kan IE 6 ikke vise transperant i et PNG billed men det findes der så
en fix til så kan man skrive noget kode som kun bliver udført i IE 6

Det også en fejl med at hvis man bruger float i IE så laver den dobbelt
margin ved den første det er der også en fix til.

Brug www.google.com og skriv "css float problem ie" hvis f.eks du har
problmer med at ie viser float forkert så kan du læse om andre har samme
problem.

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

David Nielsen (22-04-2008)
Kommentar
Fra : David Nielsen


Dato : 22-04-08 15:14

Tilføj top:0px; og left:0px; sådan her i din css fil :

#grafikb1 {
background-image:url(flower-19.png);
background-repeat:no-repeat;
width:100%;
height:100%;
position:absolute;
top:0px;
left:0px;
margin-top:19px;
z-index:-1;
}


og i din HTML så bare flyt de div som holder billederne ned til der hvor du
vil have dem i teksten :

<h1>Indhold</h1>
<div id="topflower"></div>
<div id="grafikb1"></div>

<p>Lorem ipsum d...</p>
<div id="grafik5"></div>

<p>Maecenas rutrum l...</p>
<div id="grafikb2"></div>
         
<p>Ut tincidunt. In s...</p>

<p>Nam venenatis lao...</p>
<div id="grafik2"></div>
         

<p>Suspendisse vel ...</p>
<div id="grafik3"></div>

<p>Mauris dignissim ma...</p>
<div id="grafik4"></div>

<p>Nulla facilisi. Mauri...</p>

Så virker det ens i opera 9.27 og ie 7

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jørgen Farum Jensen (22-04-2008)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 22-04-08 16:18

David Nielsen skrev:

> Det også en fejl med at hvis man bruger float i IE så laver den dobbelt
> margin ved den første det er der også en fix til.
>

Det er nu kun IE<7 der har det særdeles
velkendte problem, som bedst fikses ved
at sætte display:inline på det element, jf
http://www.webdesign101.dk/showcase/float/index.php

Til Simon:
Du vil for meget på én gang, derfor bliver din
CSS-kode ret uoverskuelig. Din HTML-kode rummer
også en del flere end nødvendigt. Pas på, at
den baggrund. du ønsker i indholdsdelen også
rent faktisk er knyttet til dette element. Umiddelbart
ser det ud som om du afslutter #content for tidligt.

Det er i min optik heller ikke heldigt med
den absolutte placering af dine state flowers.
En mere rigtig måde at gøre det på er at float'e
dem hhv left og right.

En måde at komme ud af et morads på er at
starte helt forfra - så kompliceret er
din sideopbygning altså heller ikke. Lad være
med at positionere noget som helst før
det almindelige omløb - det at elementerne
følger på hinanden i den orden de er indsat
i kildekoden - ikke er tilstrækkeligt længere.
Løs problemet med græsset i bunden og eventuelle
blomster, når du når dertil - gerne med en mere overskuelig
HTML-struktur.

PS vil jeg meget anbefale dig at anskaffe
Chris Pedericks Web Developer Toolbar til
Firefox - dette værktøj vil give dig et helt nyt
syn på den kode, du laver!

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Simon Hansen (22-04-2008)
Kommentar
Fra : Simon Hansen


Dato : 22-04-08 21:03




> Du vil for meget på én gang, derfor bliver din
> CSS-kode ret uoverskuelig. Din HTML-kode rummer
> også en del flere end nødvendigt.
Jeg vil en hel masse og sikkert også mere end godt er med mine nuværende
evner
> Pas på, at
> den baggrund. du ønsker i indholdsdelen også
> rent faktisk er knyttet til dette element. Umiddelbart
> ser det ud som om du afslutter #content for tidligt.
nej de sidder nu meget godt de div's der :)
>
> Det er i min optik heller ikke heldigt med
> den absolutte placering af dine state flowers.
> En mere rigtig måde at gøre det på er at float'e
> dem hhv left og right.
de 4 blomster er floated ind på plads (bare ikke i IE selvfølgelig) det
er min baggrund som jeg har forsøgt med position:absolute (uden noget
godt resultat i IE)
http://home20.inet.tele.dk/xqual/test <-- har flyttet siden derhen
indtil videre
>
> En måde at komme ud af et morads på er at
> starte helt forfra - så kompliceret er
> din sideopbygning altså heller ikke.
Jeg er faktisk staret forfra en hel masse gange efterhånden :)
> Lad være
> med at positionere noget som helst før
> det almindelige omløb - det at elementerne
> følger på hinanden i den orden de er indsat
> i kildekoden - ikke er tilstrækkeligt længere.
http://home20.inet.tele.dk/xqual/ <-- et let og nem løsning på alle mine
problemer skulle jeg mene. Men det handler om at lære at kontrollere css
for mig.
> Løs problemet med græsset i bunden og eventuelle
> blomster, når du når dertil - gerne med en mere overskuelig
> HTML-struktur.
Græsset skal klippes både på siden og i haven :) Men det er nu meningen
at det skal fylde hele bunden. derfor ligger det i en selvstændig div
uden for resten af layoutet (lige pt den letteste måde jeg kunne få øje
på)
Er da lidt ked af du synes min html er uoverskuelig. Jeg har nu ellers
anstrengt mig for at gøre den så let læselig som muligt. Det må jeg
kigge lidt nærmere på.
>
> PS vil jeg meget anbefale dig at anskaffe
> Chris Pedericks Web Developer Toolbar til
> Firefox - dette værktøj vil give dig et helt nyt
> syn på den kode, du laver!
Ja den er god er den. Hentede den allerede i starten af html eventyret i
februar :)
Den viser bare ikke hvad IE gør og tænker :(


Mit formål med siden er som nævnt tidligere at lære kontrol via css. Det
skaber selvsagt en masse problemer for mig. Da jeg sikkert har lagt ud
med at spurte og ikke set mig til siden.
Hvorfor floate og positionere ting på plads når man kan skrive det
direkte ind i koden?
Det er csszengardens skyld er det :) ikke fordi jeg vil/skal lave en
side til dem (er og bliver jeg aldrig dygtig nok til.. rent kunstner
mæssigt) Men jeg vil gerne lære teknikken bag den måde de får
lavet/placeret de designs der.
Har sat mig et mål. Til december skal jeg kunne tilrette et garden html.
længere er den egentlig ikke.
Men jeg har sikkert skudt lidt for højt for hurtigt. Sikkert en masse
det-skal-man-vide-om-css-og-html jeg er hoppet lidt lemfældigt over.

Hilsen
Simon

Allan Vebel (22-04-2008)
Kommentar
Fra : Allan Vebel


Dato : 22-04-08 21:28

David Nielsen skrev:

> Hvis du syns at IE ikke virker som du syns den
> skal gøre så har du sikkert ret, det er en dårlig
> browser

Fordi du ikke kan styre den, behøver det ikke at
være en dårlig browser. IE6 er en gammel browser
med nogle få ting der ikke fungerer efter hensigten,
men IE7 er noget bedre.

Jeg har aldrig haft problemer med at få det til at se
ensartet ud i IE og Firefox.

--
Allan Vebel
http://html-faq.dk
http://vebel.dk



David Nielsen (23-04-2008)
Kommentar
Fra : David Nielsen


Dato : 23-04-08 01:50

Jeg har aldrig haft problemer med at få det til at se
ensartet ud i IE og Firefox.

Seriøst ?

Er det ellers ikke det største problem lige præcist at få det til
at se ens ud i de to browsere ?

Det lyder bare mærkeligt fordi jeg syns altid der er problemer
med at det ikke ser ens ud. det kommer selvfølge an på hvor
perfektionistisk man er men når jeg tænker ens i forskellige
browsere så mener jeg pixel perfekt ens det syns jeg tit er svært
at opnå specielt når man skal tage højde for flere forskellige
browsere og flere versioner.


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jørgen Farum Jensen (23-04-2008)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 23-04-08 10:51

David Nielsen skrev:
> Jeg har aldrig haft problemer med at få det til at se
> ensartet ud i IE og Firefox.
>
> Seriøst ?
>
> Er det ellers ikke det største problem lige præcist at få det til
> at se ens ud i de to browsere ?

Siden 2002 eller deromkring har det største
design problem været at få tingene til at se
ens ud i forskellige versioner af Internet
Explorer.

Med det svindende antal IE5 og IE5.5 brugere
kan man nu bare kode i henhold til én af
strict standarderne og regne med en fornuftigt
resultat. Hvis man vil tage hensyn til ældre
versioner af Internet Explorer kan man lave specielle
versioner af sit stylesheet til netop disse browsere,
for eksempel
<!--[if lt IE 6]>
<style type="text/css" media="screen">
body {text-align:center}
#content {text-align_left;}
</style>
<![endif]-->

Det største problem nu synes at være at mange websmede
af den ene eller den anden grund ikke har sat sig
grundigt ind i HTML og CSS før de begynder at
lave komplicerede konstruktioner. Læs lige
min artikel:
http://webdesign101.dk/artikler/webstandarder.php

> Det lyder bare mærkeligt fordi jeg syns altid der er problemer
> med at det ikke ser ens ud. det kommer selvfølge an på hvor
> perfektionistisk man er men når jeg tænker ens i forskellige
> browsere så mener jeg pixel perfekt ens det syns jeg tit er svært
> at opnå specielt når man skal tage højde for flere forskellige
> browsere og flere versioner.

Hvad skulle formålet være med pixelperfekt ens
udseende i forskellige browsere? Dine brugere
har sandsynligvis kun én browser installeret
på din computer. Det er da kun nørder som os der
bekymrer sig om hvordan tingene ser ud i Netscape 4.75

Lad os bare tage det lille eksempel ovenfor:

Hvis du bruger en moderne metode til
at midtstille dit indhold vil IE5 ikke midtstille det,
men venstrestille det. Hvis det bekymrer dig, kan
du bruge ovenstående metode. Men hvorfor skulle det
bekymre dig at måske 5 procent eller mindre af dine
brugere ser dit indhold venstrestillet i stedet
for midtstillet.



--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Kerim Ellentoft (23-04-2008)
Kommentar
Fra : Kerim Ellentoft


Dato : 23-04-08 16:49

Jørgen Farum Jensen <jfjenzen@yahoo.dk> skrev :

>Dine brugere
>har sandsynligvis kun én browser installeret
>på din computer.

Det lyder uhyggeligt, at det skulle være muligt.
--
Kerim

Erik Ginnerskov (23-04-2008)
Kommentar
Fra : Erik Ginnerskov


Dato : 23-04-08 21:01

Jørgen Farum Jensen wrote:

> Det er da kun nørder som os der
> bekymrer sig om hvordan tingene ser ud i Netscape 4.75

Nåda, der kan man bare se. Her gik jeg og regnede mig selv for at være lidt
nørdet. Men det er da op til flere år siden, jeg stoppede med at tage hensyn
til NN 4.x

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk



Allan Vebel (23-04-2008)
Kommentar
Fra : Allan Vebel


Dato : 23-04-08 23:11

David Nielsen skrev:

>> Jeg har aldrig haft problemer med at få det til
>> at se ensartet ud i IE og Firefox.
>
> Seriøst?

Naturligvis, jeg tager alt seriøst, det er det jeg
lever af.

> Er det ellers ikke det største problem lige
> præcist at få det til at se ens ud i de to browsere?

Nej, som nævnt har jeg ingen problemer med den
slags.

> Det lyder bare mærkeligt fordi jeg syns altid der
> er problemer med at det ikke ser ens ud.

Du kan jo sammenlige mine sider i forskellige
browsere, og komme med en rapport om de
forskelligheder du kan finde.

Jeg bruger ikke nogen form for browser detection,
og alt er valid kode.

--
Allan Vebel
http://html-faq.dk
http://vebel.dk



Erik Ginnerskov (22-04-2008)
Kommentar
Fra : Erik Ginnerskov


Dato : 22-04-08 22:29

David Nielsen wrote:

> F.eks kan IE 6 ikke vise transperant i et PNG billed

Det kommer da an på ....

Et 100% transparent område i et .png-billede vises som transparent.

Et delvist transparent område i et .png-billede vises som
ikke-transparent.

http://hjemmesideskolen.dk/html/testsider/opac.asp#png0

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk



David Nielsen (23-04-2008)
Kommentar
Fra : David Nielsen


Dato : 23-04-08 01:56

> > F. eks kan IE 6 ikke vise transparent i et PNG billed
>
> Det kommer da an på ....
>
> Et 100% transparent område i et .png-billede vises som transparent.
>
> Et delvist transparent område i et .png-billede vises som
> ikke-transparent.
>
> http://hjemmesideskolen.dk/html/testsider/opac.asp#png0

Det var png med alpha 256 farvers transparent nu har jeg ikke prøvet med 1
farves transparent i en png men så ville jeg også bruge en gif.
Det ser bare rigtig flot ud når png alphaen virker rigtigt også hen over
en baggrund med mange farver så finde den selv ud af at lave den rigtig
farvede skygge det altså smart.

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Søg
Reklame
Statistik
Spørgsmål : 177500
Tips : 31968
Nyheder : 719565
Indlæg : 6408518
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste