Notifikationer

Markér alle som læst Log ud

theofilos Nybegynder

10. maj 2004 - 13:16 Der er 17 kommentarer og
2 løsninger

Menu og sideindhold i centreret ramme?

Kære html/css-specialister!

Så overgav jeg mig og vil nu gå bort fra frames på min hjemmeside. Men nu vælter de nye problemer ind over mig:

Jeg har fundet et godt menu-script og har lavet en skabelon, som jeg forsøger at sætte ind i en centreret tabel på min side. Men menuen bliver i scriptet defineret til at være placeret ud fra et bestemt punkt på siden (50,50)..

Dels vil jeg gerne have menuen til at være indenfor den centrede tabel - og dels vil jeg gerne have nogle tips til, hvordan jeg får en pæn hjemmeside... Skal jeg benytte tabel eller skal jeg begynde at studere css???

Jeg smider 200 points ud, da jeg ikke ved særlig meget om html og css - og sikkert vil trække meget på jeres tålmodighed. Men hånden på hjertet: Den hjemmeside skal altså bringes i orden.

I kan se den nuværende hjemmeside i frames her:

http://overgaard.1go.dk

Og den ønskede hjemmeside med tabel/css-opbygning her:

http://overgaard.1go.dk/Testmappe/testing.html

P.S. Jeg skal ordne nogle ting her i eftermiddag, så det er ikke sikkert, at jeg får mulighed for at se eventuelle kommentarer/svar før i aften.

Synes godt om

theofilos Nybegynder

10. maj 2004 - 13:19 #1

Jeg synes lige, at jeg kort vil opsummere, hvad jeg gerne vil:

1. Have menuen ind i tabellen, pænt centreret og øverst.

2. Have lavet hjemmesiden PÆN (måske min egen banner allerøverst - derefter menu - derefter indhold etc.... layoutet skal gå igen på alle sider - undtagen pop-ups)

Synes godt om

theofilos Nybegynder

10. maj 2004 - 13:20 #2

Jeg er kort tilbage om nogle timer.

Synes godt om

skovenborg Nybegynder

10. maj 2004 - 13:35 #3

prøv at skrive:
<div style="position:relative;">
<script language="JavaScript">

create_menu('ScriptBreaker',link,prop);

</script>
</div>

Og så ændre positionen til 0,0 eller eventuelt noget negativt.

Synes godt om

theofilos Nybegynder

10. maj 2004 - 15:30 #4

Jo, det ser fint ud.

Nu vil jeg så gerne arbejde videre med at få siden til at blive pæn.

Jeg har lagt et banner på siden, men det virker lidt dumt under menuen.

Er der nogen, der kan hjælpe mig med resten af siden?

Hvad ville et stylesheet kunne hjælpe mig med? Jeg er nybegynder, men har en idé om, at hovedstrukturen på alle sider skal være den samme - f.eks. som her på hovedsiden. Men kan man kombinere den centrerede tabel og et stylesheet??

Jeg har nu lagt en redigeret testside ind. Gode råd til forbedringer søges.

http://overgaard.1go.dk/Testmappe/testing.html

Synes godt om

Slettet bruger

10. maj 2004 - 17:48 #5

Hvis du kunne tænke dig, at siden ikke kommer til at se forskelligt ud i forskellige browsere, kan jeg anbefale at skifte til en nyere version af HTML, og vel at mærke overholde reglerne for den version, du bruger. Moderne browsere har nemlig to forskellige måder at vise sider på:

- Quirksmode, som bruges til sider uden DOCTYPE eller med en gammel eller forkert DOCTYPE.

- Standardsmode, som bruges til nyere og mere strikse DOCTYPES.

I quirksmode vil browseren gå ud fra at din kode er gammel, og derfor forsøger browseren at efterligne de fejl, som gamle browsere lavede, og to forskellige browsere vil sandsynligvis vise din kode på forskellig vis. Der er nemlig meget stor forskel på, hvordan Internet Explorer, Mozilla og andre vil fortolke en side i quirksmode.

I standardsmode vil browseren gå ud fra, at din kode er opdateret og korrekt, og den vil derfor (efter evne) forsøge at vise siden, sådan som standarden foreskriver. Dette betyder at der er meget mindre forskel på, hvodan forskellige browsere vil vise siden.

Det gælder altså om at få browsere til at bruge standardsmode, men der er en lille hurdle mere. Det kræver nemlig også, at du følger standarden, for som sagt går browserne ud fra, at din kode er korrekt, og hvis den ikke er, skal du ikke regne med at browserne håndterer fejl på samme måde.

Jeg vil nok anbefale HTML4.01 Strict, men det er mest fordi, det er den, jeg selv bruger.

Uanset om du bruger <div> eller <table> til at strukturere dit indhold, er det en meget god ide at lære CSS. Jeg vil anbefale at bruge <div>, hvis du har mod på det, men det kan godt være lidt kompliceret at skulle overskue, og <table> virker trods alt.

Synes godt om

roenving Novice

10. maj 2004 - 17:52 #6

Og tables har sine fordele, hvor divs har sine (andre !-)

Synes godt om

theofilos Nybegynder

10. maj 2004 - 17:56 #7

Sandbox,
Den første linje: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN"> stammer fra et forslag her fra eksperten til, hvordan man kan centrere indholdet i en hjemmeside - ikke bare horisontalt, men også vertikalt, altså i højden.

For at kunne bruge height:100% med tabel krævedes der åbenbart denne DOC-oplysning i første linje.

En vertikal centrering er ikke så vigtig for mig - ja, jeg har faktisk slettet den nu.

Hvad vil du anbefale, at jeg gør? Skal jeg bruge html-skabelonen fra TSW WebCoder?

Som sagt.. jeg er ikke ekspert på dette område.

Prøv at tjekke siden nu... Nu er den ved at udvikle sig i den rigtige retning, synes jeg. (http://overgaard.1go.dk/Testmappe/testing.html)

Synes godt om

skovenborg Nybegynder

10. maj 2004 - 18:35 #8

hvis du vil beholde den nuværende kode vil jeg nok anbefale at bruge 4.01 Transitional i stedet for strict (selvom jeg personligt foretrækker denne). På den måde behøver du heller ikke ændre alt for meget.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Synes godt om

Slettet bruger

10. maj 2004 - 18:47 #9

Din DOCTYPE er sådan set også korrekt. Den er bare meget gammel. (HTML 4 blev en anbefalet standard i 1997.) Den version, jeg anbefaler (HTML 4.01), var W3C's julegave til os i 1999, så den er heller ikke helt ny mere, men den bliver nok ikke forældet foreløbig.

Hvis du ønsker at bruge HTML 4.01, så findes den i 3 udgaver: Strict (som kræver at du bruger CSS til en del ting, som din nuværende kode gør på anden vis), Transitional (som ikke er helt så striks) og Frameset (som ikke bør bruges på normale sider.)

Til at begynde med, skal du nok bruge Transitional. Den ser således ud:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Så er der et par steder i din kode, hvor du skal rette lidt til: dine script-tags skal have en type-attribut i stil med type="text/javascript", og dit billede skal have alt-attributten med også. Den bør i dit tilfælde se således ud: alt="Salmer af Randi W. Korsgaard og Niels Overgaard"

Formålet med alt-attributten er at hjælpe folk, der af forskellige årsager ikke kan se dit billede. Den skal regnes som et tekstbaseret alternativ til selve billedet, så til rene pyntebilleder bør man bare skrive alt=""

Når du nu alligevel har en body-sektion i dit CSS, kan du lige så godt flytte baggrundsbilledet derhen. Bare skriv

background: url(images/forside2.jpg);

og slet det fra <body>-taggen.

Til sidst er der din </br>, som er forkert. br er et såkaldt "tomt element", så der findes ikke en sluttag til det i HTML.

Synes godt om

skovenborg Nybegynder

10. maj 2004 - 19:08 #10

body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}

kan også forkortes til:
body {margin:0px 0px 0px 0px;} (top-margin right-margin bottom-margin left-margin)
eller blot:
body {margin:0px;}

Synes godt om

skovenborg Nybegynder

10. maj 2004 - 19:14 #11

hvis du holder dig til dette design kan det faktisk være ligeså let at bruge css til at opbygge dit design. Ud over det har sine fordele frem for tabeller (og ulemper), så kan det også være med til at øge dit kendskab til css, hvilket er næsten ligeså vigtigt som almindelig html (efter min mening).

Jeg kan godt vise dit et eksempel på hvordan hvis du har lyst :-)
Læs evt.
http://www.eksperten.dk/artikler/104 og
http://www.html.dk/artikler/00043/

Synes godt om

theofilos Nybegynder

10. maj 2004 - 20:01 #12

Uha, Skovenborg og sandbox... Jeg kan godt se pointen i css - forøvrigt et par RIGTIG gode artikler.
Spørgsmålet er bare, om jeg kan nå at lære det hele...

Hvordan centrerer man css i forhold til browserstørrelse - og hvad med browsertyper, hvad kan hvilke versioner læse og ikke...

Men under alle omstændigheder, så har I begge hjulpet mig godt på vej, så jeg vil fordele pointene således: Skovenborg 120 Sandbox 80... Håber det er OK.

Men jeg skal vist have MANGE flere tips hen ad vejen, når jeg nu begynder at læse på css-programmering...

Send et par svar - så får i pointsene...

P.S. Problemet med css - er det ikke overskueligheden? Er det ikke svært at finde rundt i - i forhold til html's nogenlunde logiske og kronologiske opbygning? Det er mest det, der skræmmer mig... Men på den anden side... opdatering skulle blive meget nemmere, hvis siderne skal have samme layout...

Synes godt om

roenving Novice

10. maj 2004 - 20:27 #13

Men med css har du så nogle helt andre fordele, for med 'gammeldags' html skulle du for hvert eneste element angive alle de properties du ønskede for elementet, nu kan du gruppere dem i klasser med et fælles property-sæt, og på een gang ændre en property og alle i klassen ændres så ...

Synes godt om

skovenborg Nybegynder

10. maj 2004 - 20:30 #14

normalt bruger jeg:
margin:0px auto;
på en div til at centrere. Fx:
<div style="width:600px;margin:0px auto;">
Indhold
</div>

Umiddelbart ville jeg skrive siden sådan her:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">

</style>

<link rel="stylesheet" href="http://overgaard.1go.dk/Testmappe/ScriptBreaker_menu.css">
<script language="JavaScript" src="http://overgaard.1go.dk/Testmappe/ScriptBreaker_items.js"></script>
<script language="JavaScript" src="http://overgaard.1go.dk/Testmappe/ScriptBreaker_menu.js"></script>

</head>

<body>

<div id="container">



<div style="position:relative;">
<script language="JavaScript">

create_menu('ScriptBreaker',link,prop);

</script>

</div>


<img src="http://overgaard.1go.dk/Testmappe/images/animtest.gif" width="590" height="80">



<br> </br>
<p>Mine ting skal lægges i denne tabel, som centreres på siden...
Nu er menuen kommet ind i tabellen. Det er rigtig godt! I øjeblikket
står den vertikalt -26 pkt. fra 0 - dvs. grafisk lige over tabellen.
Nu er det lykkes at sætte et (meget hurtigt produceret) banner ind.
</p>
<p>Jeg har nu også sat nogle css-koder for "P-tekst" ind. Det ser meget bedre ud nu</p>
<p>Men send endelig flere kommentarer og gode tips, så hjemmeside-layoutet kan blive færdigt.</p>

</div>

</body>
</html>

Jeg kan ikke helt få det til at virke med menuen og billedet som opfører sig lidt mærkeligt - men måske går det bedre for dig ;-)

Ellers er der skam ikke noget i vejen med at bruge tabeller - især hvis du bedst kan finde ud af dem. Men jeg vil anbefale dig at lære noget CSS (fx fra http://www.html.dk) - herefter vil det være lidt lettere at begynde med at lave design uden tabellerne.

Synes godt om

skovenborg Nybegynder

10. maj 2004 - 20:32 #15

glemte foresten at rette dit </br> tegn samt de andre ting sandbox udpegede.

Synes desuden vi ligeså godt kan dele 50/50 - kan ikke se noget problem i det.

Synes godt om

Slettet bruger

10. maj 2004 - 22:29 #16

Angående overskueligheden, så kommer det an på, hvordan du arangerer din kode. Hvis du laver en ny klasse til hver eneste <p> i din HTML og giver den en ny stil, så kan det hurtigt blive meget uoverskueligt. Til gengæld kan det i klassisk HTML med <font>-tags over det hele være lidt svært at få øje på strukturen i dokumentet.

Hvis du til skovenborgs forslag tilføjer

text-align: center;

til body-delen af CSSen, burde det virke.

Synes godt om

theofilos Nybegynder

10. maj 2004 - 22:31 #17

Tak for det, Skovenborg. Nu skulle jeg kunne klare mig et stykke videre i arbejdet. Jeg spørger på eksperten igen, når jeg sidder fast næste gang. Måske nok ikke med et 200 ponits spørgsmål.

Sandbox... Vil du lige give mig et svar, så får I hver 100 points.

Det var en fornøjelse. Tak for hjælpen - også til Roenving for kommentarerne.

Synes godt om

theofilos Nybegynder

10. maj 2004 - 22:32 #18

Ups... Sandbox. Du nåede lige at svare, inden min sidste besked. Så jeg har fordelt pointene nu.

Tak endnu engang

Synes godt om

skovenborg Nybegynder

10. maj 2004 - 23:53 #19

og tak for de points da :-)

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS