|
| Hjælp til div og css placering Fra : Tine Müller |
Dato : 11-03-04 13:52 |
|
Jeg er ved at lave en ny hjemmeside, hvor jeg både har brugt div, css og
tabeller samt noget javascript specielt beregnet for Dreamweaver MX
http://www.tinemuller.dk/3jytte/, men vil meget gerne prøve at lave den kun
med div og css og har foreløbigt lavet denne side
http://www.tinemuller.dk/4jytte/.
Jeg har nu prøvet i flere timer at placere webadressen, mail og adressen
oppe i "top", uden at bruge tabel, men kan simpelt hen ikke få det til at
virke. Håber nogen kan hjælpe mig.
Hvis jeg først får hjælp til "top", kan jeg jo sikkert nok finde ud af at
placere de andre tekster på siden.
Begge sider hedder css-filen: jytte.css
--
/Tine
| |
Jens Gyldenkærne Cla~ (11-03-2004)
| Kommentar Fra : Jens Gyldenkærne Cla~ |
Dato : 11-03-04 14:31 |
|
Tine Müller skrev:
> Jeg har nu prøvet i flere timer at placere webadressen, mail
> og adressen oppe i "top", uden at bruge tabel, men kan simpelt
> hen ikke få det til at virke.
Hvad har du forsøgt, hvordan vil du gerne have det til at se ud og
hvordan ser det ud når du prøver?
Nå, ved at se på den gamle side vil jeg tro at det er noget
lignende du gerne vil have på den nye.
Jeg kan se at du har brugt position til at placere dine
hovedelementer på siden. Så vil jeg foreslå at du fortsætter med
det til at placere indholdet i top. Lav to bokse - en til web- og
mailadresse og en til postadressen. Placer dem begge inde i din
top-div, så vil position-værdier relatere til denne div.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html
| |
Tine Müller (11-03-2004)
| Kommentar Fra : Tine Müller |
Dato : 11-03-04 15:46 |
|
"Jens Gyldenkærne Clausen" <jens@gyros.invalid> skrev
> Jeg kan se at du har brugt position til at placere dine
> hovedelementer på siden. Så vil jeg foreslå at du fortsætter med
> det til at placere indholdet i top. Lav to bokse - en til web- og
> mailadresse og en til postadressen. Placer dem begge inde i din
> top-div, så vil position-værdier relatere til denne div.
Tak for dit svar.
Ja, jeg har lavet et layer relativ med auto og heri har jeg placeret 3
layers absolut.
Nu har jeg arbejdet lidt videre. Er det sådan man gør?
http://www.tinemuller.dk/4jytte/jytte.css
--
/Tine
| |
Erik Ginnerskov (11-03-2004)
| Kommentar Fra : Erik Ginnerskov |
Dato : 11-03-04 14:54 |
| | |
Tine Müller (12-03-2004)
| Kommentar Fra : Tine Müller |
Dato : 12-03-04 07:58 |
| | |
Erik Ginnerskov (12-03-2004)
| Kommentar Fra : Erik Ginnerskov |
Dato : 12-03-04 13:53 |
|
"Tine Müller" <tinem@email.dk> skrev
> Hej Erik
>
> Tak for dit svar. Jeg ved ikke om du fik set mit eget forsøg inden du
> svarede, men ellers kan det ses her http://www.tinemuller.dk/4jytte/ og
> http://www.tinemuller.dk/4jytte/jytte.css
Det virker fint på den side.
>
> Jeg har lavet dine foreslåede rettelser, som kan ses her
> http://www.tinemuller.dk/7jytte/ og
> http://www.tinemuller.dk/7jytte/jytte.css
Det burde også være på plads her, men prøv at lave denne lille ændring i
css:
..link{
position:absolute;
top:25px;
left:130px;
}
..navn{
position:absolute;
top:15px;
left:480px;
}
> ContentWrapper er relativ og med auto for at centrere, så derfor regnede
jeg
> med at man skulle lave de 3 layers herinde "absolut", fordi de vel retter
> sig efter ContentWrapper?
For det første vil et absolut positioneret element ikke respektere en
centrering i et overordnet element - det lægger sig på de koordinater, der
er defineret til det pågældende element i forhold til nærmeste overodnede
positionerede (relativ eller abslut) element.
For det andet er der ikke nogen tvingende grund til at bruge absolut
positionering på et element, der alligevel skal ligge i øverste venstre
hjørne af et overordnet element, medmindre et efterfølgende element også
skal lægges til det samme hjørne men uden positionering *1)
> Det er min første side, hvor jeg vil prøve kun at bruge CSS og div for at
> lære dette, så det betyder virkelig meget for mig med respons, så at jeg
gør
> dette på den "rigtige måde" (hvis sådan en findes), så jeg se tilbage på
> denne side senere.
Det synes jeg er den rette indstilling. Man skal aldrig være bange for at
lære nye kunster.
1) Et eksempel: En topbar, en menu til venstre og et sideindhold til venstre
herfor. På hjemmesideskolens sider har jeg lagt menuen ind absolut i øverste
venstre hjørne med en toppadding svarende til højden på topbaren. Sidernes
indhold er bare lagt ind med samme toppadding som menuen og med en
venstrepadding svarende til menuens bredde. Sideinholdets boks ligger reelt
helt oppe i venstre hjørne, men boksens indhold bliver af padding skubbet
ned i det felt, hvor andet ikke skygger over det.
Jeg har før haft absolut positionering på indholdsboksen, men det gav i IE6
det problem, at der ikke kunne kopieres kodeeksempler fra siderne.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://html-faq.dk
http://hjem.get2net.dk/egin
| |
Erik Ginnerskov (12-03-2004)
| Kommentar Fra : Erik Ginnerskov |
Dato : 12-03-04 14:31 |
| | |
Tine Müller (17-03-2004)
| Kommentar Fra : Tine Müller |
Dato : 17-03-04 09:32 |
|
Jeg har nu efter flere dages hårdt arbejde nået frem til denne side
http://www.tinemuller.dk/8jytte/ og
http://www.tinemuller.dk/8jytte/jytte.css og hører gerne fra Jer om der er
nogle ting som skulle være lavet på en anden måde eller måske kunne være
lavet lettere?
Jeg har brugt Dreamweaver MX 2003 og template, så jeg er ikke sikker på om I
kan se siden med koderne rigtigt?
M.h.t. font-family kunne jeg så have bestemt denne for f.eks. #toppen -
#menu - #main og så ville de tekster som fremkom herinde blive efter denne
istedet for at kode flere forskellige underpunkter med denne?
Jeg har "næsten" lavet siden kun med div og css, dog ikke hvor jeg skulle
have en opstilling, der satte jeg altså en tabel ind, jeg orkede simpelthen
ikke mere.
Jeg synes, det er hårdt arbejde og glæder mig til den dag, hvor jeg indser
at dette skulle være så fantastisk, altså at undlade tabeller og kun bruge
div og css.
--
/Tine
| |
Jorgen Peter Kjeldse~ (17-03-2004)
| Kommentar Fra : Jorgen Peter Kjeldse~ |
Dato : 17-03-04 09:47 |
|
"Tine Müller" <tinem@email.dk> skrev i en meddelelse
news:w1U5c.4155$aP.104@news.get2net.dk...
> Jeg har nu efter flere dages hårdt arbejde nået frem til denne side
> http://www.tinemuller.dk/8jytte/ og
> http://www.tinemuller.dk/8jytte/jytte.css og hører gerne fra Jer om der er
> nogle ting som skulle være lavet på en anden måde eller måske kunne være
> lavet lettere?
Hej,
du har svaret på et indlæg, så du er kommet ind i en en igangværende tråd.
Hvis du vil have svar på din henvendelse, bør du nok starte en ny tråd med
et selvstændigt emne.
Din side har ingen <title>, men bortset fra det synes jeg det ser rigtig
godt ud (i IE og Mozilla). Jeg er ikke selv ekspert og vil ikke kigge på din
kode, men siden validerer ialfald, så det er da en god start!
Venlig hilsen
Jørgen Peter Kjeldsen
"hobby-hjemmeside-layouter"
| |
Jorgen Peter Kjeldse~ (17-03-2004)
| Kommentar Fra : Jorgen Peter Kjeldse~ |
Dato : 17-03-04 09:59 |
|
"Jorgen Peter Kjeldsen" <admin@prinzapolka.dk> skrev i en meddelelse
news:4058107f$0$189$edfadb0f@dread11.news.tele.dk...
> du har svaret på et indlæg, så du er kommet ind i en en igangværende tråd.
> Hvis du vil have svar på din henvendelse, bør du nok starte en ny tråd med
> et selvstændigt emne.
Undskyld, jeg kvajede mig, havde ikke set at det rent faktisk var dig som
havde startet tråden! Sorry!
Jørgen Peter
| |
Martin Buhelt (17-03-2004)
| Kommentar Fra : Martin Buhelt |
Dato : 17-03-04 11:24 |
|
"Tine Müller" <tinem@email.dk> skrev i en meddelelse
news:w1U5c.4155$aP.104@news.get2net.dk...
> Jeg har nu efter flere dages hårdt arbejde nået frem til denne side
> http://www.tinemuller.dk/8jytte/ og
> http://www.tinemuller.dk/8jytte/jytte.css og hører gerne fra Jer om der er
> nogle ting som skulle være lavet på en anden måde eller måske kunne være
> lavet lettere?
>
> Jeg har brugt Dreamweaver MX 2003 og template, så jeg er ikke sikker på om
I
> kan se siden med koderne rigtigt?
>
> M.h.t. font-family kunne jeg så have bestemt denne for f.eks. #toppen -
> #menu - #main og så ville de tekster som fremkom herinde blive efter denne
> istedet for at kode flere forskellige underpunkter med denne?
>
> Jeg har "næsten" lavet siden kun med div og css, dog ikke hvor jeg skulle
> have en opstilling, der satte jeg altså en tabel ind, jeg orkede
simpelthen
> ikke mere.
>
> Jeg synes, det er hårdt arbejde og glæder mig til den dag, hvor jeg indser
> at dette skulle være så fantastisk, altså at undlade tabeller og kun bruge
> div og css.
Det ser fint ud - i Internet Explorer 6.
I Opera (v. 7.23) og Mozilla (1.6) bliver indholdet vist forkert ved lange
tekster (fx på Krop / Gestalt-terapi) - kassen udvider sig ikke.
Internet Explorer 5 centrerer ikke siden.
Netscape Communicator 4,75 er helt i skoven (og den er der faktisk stadig
nogen der benytter - specielt virksomheder).
.... så alt i alt har du fat i ca. 95% af brugerne
Jeg har ikke tjekket din kode, men min erfaring er (desværre), at det er for
tidligt endnu udelukkende at basere sit design på css - ved at benytte
tables kan man få 100% af brugerne med.
/Martin
| |
Tine Müller (17-03-2004)
| Kommentar Fra : Tine Müller |
Dato : 17-03-04 12:29 |
|
"Martin Buhelt" <mb@nospam.dk> skrev
> I Opera (v. 7.23) og Mozilla (1.6) bliver indholdet vist forkert ved lange
> tekster (fx på Krop / Gestalt-terapi) - kassen udvider sig ikke.
>
> Internet Explorer 5 centrerer ikke siden.
Mange tak for dit svar.
Jeg har nu sat noget kode ind på siden, som skulle centrere indholdet i
ovennævnte, så hvis du gider at have ulejlighed med at tjekke den igen,
ville jeg da være glad.
Jeg har indsat disse koder:
<!--[if IE 5]>
<style>
body {text-align: center;}
#contentWrapper {width: 760px; text-align: left;}
</style>
<![endif]-->
Nu skal jeg så bare finde ud af problemet med de lange tekster. Måske har
du/I et forslag?
/Tine
| |
Martin Buhelt (17-03-2004)
| Kommentar Fra : Martin Buhelt |
Dato : 17-03-04 15:00 |
|
"Tine Müller" <tinem@email.dk> skrev i en meddelelse
news:BDW5c.5144$Yn2.3628@news.get2net.dk...
> "Martin Buhelt" <mb@nospam.dk> skrev
> > I Opera (v. 7.23) og Mozilla (1.6) bliver indholdet vist forkert ved
lange
> > tekster (fx på Krop / Gestalt-terapi) - kassen udvider sig ikke.
> >
> > Internet Explorer 5 centrerer ikke siden.
>
>
> Mange tak for dit svar.
> Jeg har nu sat noget kode ind på siden, som skulle centrere indholdet i
> ovennævnte, så hvis du gider at have ulejlighed med at tjekke den igen,
> ville jeg da være glad.
>
> Jeg har indsat disse koder:
> <!--[if IE 5]>
> <style>
> body {text-align: center;}
> #contentWrapper {width: 760px; text-align: left;}
> </style>
> <![endif]-->
Ja - så virker det. Men det er nu noget rod, at skulle lave specielle koder
til forskellige browser-versioner - synes jeg. Så hellere lave noget der
fungerer overalt (og det ved jeg jo godt at man ikke kan!).
> Nu skal jeg så bare finde ud af problemet med de lange tekster. Måske har
> du/I et forslag?
Tabeller - men det må man vist ikke sige højt her
Jeg vil tro, at du skal fjerne HEIGHT: 495px; fra #main. Det ser ud til at
Opera og Mozilla tager det noget mere bogstaveligt (og formentlig korrekt)
end Internet Explorer. Du vil så muligvis mene at kassen bliver for lille,
men det må du så klare med lidt "tomt" indhold (fx. et gennemsigtigt
gif-image) - eller lidt mere reelt indhold. Du kan også sætte en scroll-bar
på #main kassen med "overflow:auto", men så er du vist for alvor på afveje!
Alt i alt er det primært et designspørgsmål - skal kassen have fast
størrelse eller skal den følge indholdet.
/Martin
| |
Tine Müller (17-03-2004)
| Kommentar Fra : Tine Müller |
Dato : 17-03-04 16:19 |
|
Martin Buhelt" <mb@nospam.dk> skrev >
Ja - så virker det. Men det er nu noget rod, at skulle lave specielle koder
> til forskellige browser-versioner - synes jeg. Så hellere lave noget der
> fungerer overalt (og det ved jeg jo godt at man ikke kan!).
>
> > Nu skal jeg så bare finde ud af problemet med de lange tekster. Måske
har
> > du/I et forslag?
>
> Tabeller - men det må man vist ikke sige højt her
>
> Jeg vil tro, at du skal fjerne HEIGHT: 495px; fra #main. Det ser ud til at
> Opera og Mozilla tager det noget mere bogstaveligt (og formentlig korrekt)
> end Internet Explorer. Du vil så muligvis mene at kassen bliver for lille,
> men det må du så klare med lidt "tomt" indhold (fx. et gennemsigtigt
> gif-image) - eller lidt mere reelt indhold. Du kan også sætte en
scroll-bar
> på #main kassen med "overflow:auto", men så er du vist for alvor på
afveje!
>
> Alt i alt er det primært et designspørgsmål - skal kassen have fast
> størrelse eller skal den følge indholdet.
Tak for dit svar, men jeg tror at jeg beholder designet. Prøv at se på
stastistikkerne her ude til højre http://www.echoecho.com/dk/
Jeg stillede spørgsmålet i Dreamweavers gruppe og der var svaret at Netscape
næsten ikke bruges mere og da det ikke er til en stor virksomhed jeg laver
siden, men til en psykoterapeut som lige er startet, så tror jeg ikke at jeg
vil lave noget om.
Jeg prøvede først med table, men kunne ikke få det til at virke som jeg
ønskede.
--
/Tine
| |
Martin Buhelt (18-03-2004)
| Kommentar Fra : Martin Buhelt |
Dato : 18-03-04 09:33 |
|
"Tine Müller" <tinem@email.dk> skrev i en meddelelse
news:G%Z5c.5265$TP4.487@news.get2net.dk...
> Tak for dit svar, men jeg tror at jeg beholder designet. Prøv at se på
> stastistikkerne her ude til højre http://www.echoecho.com/dk/
OK - men det er bare lidt uklart hvad der er dit (ønskede) design - når du
har sat højde på en boks, men mere tekst i den end der så er plads til, hvad
skal der så ske? Det bør *du* vel tage stilling til og ikke overlade til
hvad den enkelte browser nu finder på!
Mht. statistikken så må du jo spørge dig selv om det du opnår er det mistede
antal besøgende værd. 2% er naturligvis ikke mange, hvis man har 100
besøgende, men hvis man har 100.000 besøgende begynder det at ligne en lidt
høj pris!
> Jeg stillede spørgsmålet i Dreamweavers gruppe og der var svaret at
Netscape
> næsten ikke bruges mere og da det ikke er til en stor virksomhed jeg laver
> siden, men til en psykoterapeut som lige er startet, så tror jeg ikke at
jeg
> vil lave noget om.
For nu lige at citere dig selv fra et tidligere indlæg i denne tråd:
"Det er min første side, hvor jeg vil prøve kun at bruge CSS og div for at
lære dette, så det betyder virkelig meget for mig med respons, så at jeg gør
dette på den "rigtige måde" (hvis sådan en findes), så jeg se tilbage på
denne side senere. "
Hvis du senere skal lave noget til en stor virksomhed, tror jeg ikke at de
vil acceptere, at du kun kan finde ud af at lave sider der kan ses i
Internet Explorer!
> Jeg prøvede først med table, men kunne ikke få det til at virke som jeg
> ønskede.
Men igen - hvis det er uklart hvad du ønsker, så er det lidt svært.
/Martin
| |
Tine Müller (21-03-2004)
| Kommentar Fra : Tine Müller |
Dato : 21-03-04 11:48 |
|
[snip]Første forsøg på div og css placering[snip]
Jeg har nu uploaded siden under det rigtige domæne
http://www.j-lundsgaard.dk/ og mener efterhånden at den er ved at være
færdig. Jeg mangler så "kun" at finde ud af problematikken vedr.
søgemaskiner m.m.
Hvis der er nogen som har yderligere kommentarer end de tidligere modtager
jeg dem meget gerne.
--
/Tine
| |
Lars Olesen (21-03-2004)
| Kommentar Fra : Lars Olesen |
Dato : 21-03-04 12:49 |
|
Tine Müller wrote:
> Hvis der er nogen som har yderligere kommentarer end de tidligere modtager
> jeg dem meget gerne.
Den er ikke helt god i Mozilla! Din adresse kan ikke være i den øverste
bar; der er et link som gemmer sig bag det hele, og måske skulle du
sætte nogle paddings på dine elementer?
Ellers kan jeg godt lide layoutet. Held og lykke med gesjæften :D
--
Lars Olesen
Konkurrence på < http://www.fodboldenslegestue.dk>
Kan det gøres bedre? Navigation og brugervenlighed!
| |
Tine Müller (21-03-2004)
| Kommentar Fra : Tine Müller |
Dato : 21-03-04 13:36 |
|
"Lars Olesen" <lsolesen@hotmail.com> skrev
> > Hvis der er nogen som har yderligere kommentarer end de tidligere
modtager
> > jeg dem meget gerne.
>
> Den er ikke helt god i Mozilla! Din adresse kan ikke være i den øverste
> bar; der er et link som gemmer sig bag det hele, og måske skulle du
> sætte nogle paddings på dine elementer?
Tak for dit svar. Jeg ved simpelthen ikke hvad der er sket, men siden ser da
også forfærdelig ud i Explorer 6 nu.
Det må jeg lige have undersøgt.
--
/Tine
| |
|
|