Avatar billede agersten Nybegynder
16. februar 2007 - 20:40 Der er 34 kommentarer og
1 løsning

hjemmesider i tabeller lavet i frontpage!!

Hejsa, jeg har lavet en hjemmeside i frontpage i tabeller (brugte før frames).
Jeg har lavet den i en iframe, og så bygget den op med tabeller: top, midte og venstre.
I venstre side har jeg indsat en ny tabel med mine links. hvis jeg så indsætter en tabel i midten med tekst og vil scolle ned af siden, følger tabellen i venstre side med links'ne med - det skal den ikke.
Ligesom man kan skrive "background-attachment: fixed" må man da kunne lave en lignende regel for den tabel i venstre side?

www.julie-agersten.dk tryg på "biography" for at se problemet. desuden laver den en scroll i bunden, og det vil jeg heller ikke have :(

Håber på hurtig hjælp, da jeg gerne vil launche siden i weekenden! Tak !

/Julie
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:05 #1
Prøv at rette:

    <div align="center">
      <table style="border-collapse: collapse;" id="table1" border="0" cellpadding="0" width="65%">
        <tbody><tr>
          <td colspan="2">&nbsp;</td>
        </tr>
        <tr>
          <td colspan="2">&nbsp;</td>
        </tr>
        <tr>
          <td colspan="2">&nbsp;</td>
        </tr>
        <tr>
          <td colspan="2">


til:


<div style="float:right;margin-top:50px;padding:20px 0px;width:665px;height:290px;overflow:auto;">
      <table style="border-collapse: collapse;" id="table1" border="0" cellpadding="0" width="65%">
        <tbody>
        <tr>
          <td colspan="2">


...

samt:


<STYLE>BODY {
    BACKGROUND-ATTACHMENT: fixed
}
</STYLE>
</head>

<body background="Style/Baggrund2.gif">


til


<style type="text/css">
html,body {margin:0px;padding:0px;}

body {background:url('123_files/Baggrund2.gif') no-repeat;}
</style></head><body>
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:07 #2
Måske ser det lidt bedre ud med denne div style istedet:

<div style="float:right;margin-top:60px;padding:10px 0px;width:665px;height:290px;overflow:auto;">

... Men prøv at rokere lidt på tallene til du rammer noget du ønsker.

- Lidt nysgerrig, hvorfor kører du det i en iframe ?
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:09 #3
Hov kast lige denne ind i dit iframe tag så FF leger med: scrolling="no"
Avatar billede agersten Nybegynder
16. februar 2007 - 21:16 #4
Jeg har lige i mellemtiden lagt et stylesheet ind - gider du lige se igen, om jeg stadig skal sætte din forslåede kode ind?
Et lidt dumt spørgsmål: den kode, du har lavet, skal den sættes ind på selve "bio" siden eller index/ front siderne?
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:24 #5
Et eksempel på det hele uden frames m.v. er måske:
- måske skal billede stier ændres lidt til.


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

<head>
<TITLE>Julie Agersten.dk - Horsephotographer</TITLE>
<META NAME="Description" CONTENT="Horsephotographer/ Hestefotograf Julie Agersten: Julie-Agersten.dk indeholder primært billeder af fuldblodsarabere bla billeder af mine heste samt billeder fra div shows fx All Nations Cup 05.">
<meta name="Keywords" content="julie agersten, photography, turban stud, nikon ">
<META NAME="Copyright" CONTENT="julie agersten">
<META NAME="Robots" CONTENT="INDEX,NOFOLLOW">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="imagetoolbar" content="false">
<title>Forside</title>
<meta http-equiv="Page-Enter" content="blendTrans(Duration=1.0)">

<style type="text/css">
html,body {margin:0px;padding:0px;}
html {overflow:auto;}

#main {background:url('/Images/Baggrunde/Baggrund2.gif') #373737 no-repeat 50% 0;height:520px;position:relative;}
</style></head><body>

<div id="main">

<table border="0" cellpadding="0" cellspacing="0" height="472" width="960" style="width:960px;height:472px;margin:0px auto;">
  <!-- MSTableType="nolayout" -->
  <tbody><tr>
    <td valign="top">
    <!-- MSCellType="DecArea" -->
    &nbsp;</td>
    <td height="105" valign="top">
    <!-- MSCellType="ContentHead" -->
    &nbsp;</td>
  </tr>
  <tr>
    <td valign="top" width="180">
    <!-- MSCellType="NavBody" -->
    <div>
  <table style="border-collapse: collapse;" id="table2" border="0" cellpadding="0" width="98%">
    <tbody><tr>
      <td width="30">&nbsp;</td>
      <td>
      <p align="center"><b><font color="#cccccc" face="Arial" size="2">Info</font></b></p></td>
    </tr>
    <tr>
      <td height="18" width="30"></td>
      <td height="18">
      <p style="text-align: left;"><font color="#cccccc" face="Arial" size="2"><i>
      - News</i></font></p></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td style="text-align: left;"><font color="#cccccc" face="Arial" size="2"><i>
      - Biography</i></font></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td style="text-align: left;"><i>
      <font color="#cccccc" face="Arial" size="2">- </font></i>
      <font color="#cccccc" face="Arial"><i><font size="2">References</font></i></font></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td>
      <p style="text-align: left;"><i>
      <font color="#cccccc" face="Arial" size="2">- Contact</font></i></p></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td>
      <p style="text-align: left;"><i>
      <font color="#cccccc" face="Arial" size="2">- Photo shoot 2007</font></i></p></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td>
      <p align="center"><font color="#cccccc" face="Arial" size="2"><b>Photography</b></font></p></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td>
      <p style="text-align: left;"><i>
      <font color="#cccccc" face="Arial" size="2">- Portfolio</font></i></p></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td>
      <p style="text-align: left;"><i>
      <font color="#cccccc" face="Arial" size="2">- Show Galleries</font></i></p></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td>
      <p style="text-align: left;"><font color="#cccccc" face="Arial" size="2">
      <i>- Copyright</i></font></p></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td style="text-align: left;">&nbsp;</td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td align="center"><font color="#cccccc" face="Arial" size="2"><b>My Horses</b></font></td>
    </tr>
    <tr>
      <td width="30">&nbsp;</td>
      <td align="center"><b><font color="#cccccc" face="Arial" size="2">Links</font></b></td>
    </tr>
    </tbody></table>
</div>

    </td>
    <td height="367" valign="top" width="790">
    <!-- MSCellType="ContentBody" -->
    <div style="float:right;margin-top:60px;padding:10px 0px;width:665px;height:290px;overflow:auto;">
      <table style="border-collapse: collapse;" id="table1" border="0" cellpadding="0" width="65%">
        <tbody>
        <tr>
          <td colspan="2">
      <p align="left">
      <span style="font-size: 12pt; font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
      I have always had an interest for photography. I have been used to be both
      behind and in front of the camera with a photographer as dad. His cameras
      have been used continuously since I got my first pony and then at photo
      courses.</span></p></td>
        </tr>
        <tr>
          <td colspan="2">&nbsp;</td>
        </tr>
        <tr>
          <td width="47%">
      <p align="left">
      <span style="font-size: 12pt; font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
          When I started at the Media school I learned the real techniques and
      the use of Adobe Photoshop. After&nbsp; reading the book</span><font color="#cccccc" face="Arial" size="3">
          "Faszination Araberpferde"</font><span style="font-size: 12pt; font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
          by Lída Jahn Mícek I knew what I wanted to do with my photography:
      capture the beauty of the Arabian Horses. </span>
          </p></td>
          <td width="53%">
          <font face="Arial">
          <img src="/Images/Dali-skygge.jpg" border="0" height="189" width="285"></font></td>
        </tr>
        <tr>
          <td rowspan="2" width="47%">
          <p align="left">
          <span style="font-size: 12pt; font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
          I didn&#8217;t know anything about the breed itself.</span></p></td>
          <td width="53%">
          <p align="center"><font color="#cccccc" face="Arial" size="2">Dalí SS 11-25-2006</font></p></td>
        </tr>
        <tr>
          <td width="53%">
          <p align="center">&nbsp;</p></td>
        </tr>
        <tr>
          <td colspan="2">
      <p align="left">
      <span style="font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
      My mom reminded me about a large stud near by (the Turban Stud) and
      suggested I gave them a call. I called and asked if I could photograph
      their horses and </span>
          <font color="#cccccc" face="Arial">the rest is history.</font></p></td>
        </tr>
        <tr>
          <td colspan="2" align="left">
          <span style="font-family: Arial; color: rgb(204, 204, 204);" lang="en-gb">
          I even ended up buying my first Arabian </span>
          <span style="font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
          horse with my mom at the stud.</span></td>
        </tr>
        <tr>
          <td colspan="2" align="left">&nbsp;</td>
        </tr>
        <tr>
          <td colspan="2" align="left">
      <span style="font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
          As the years goes by my pictures have improved. At first I had
      approximately 5 great shots on a roll, but luckily the number increases.
      With the help from my teacher at the Media School I learned a lot about
      shapes, cropping etc. &#8211; what you have to look for in a photograph:</span></td>
        </tr>
        <tr>
          <td colspan="2" align="left">
          <span style="font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
          It isn't enough the horse is just standing there; you need to unite
          its position, light, movement, shape of the neck, shadow and so on.</span></td>
        </tr>
        <tr>
          <td>
          <font face="Arial">
          <img src="/Images/ShowShow035-Perm.jpg" border="0" height="170" width="256"></font></td>
          <td>
          <p align="right">
          <font face="Arial">
          <img src="/Images/ElectraAlea.gif" border="0" height="170" width="255"></font></p></td>
        </tr>
        <tr>
          <td>
          <p align="center"><font color="#cccccc" face="Arial" size="2">Perm - Stallion
          Presentation 2003</font></p></td>
          <td>
          <p align="center"><font color="#cccccc" face="Arial" size="2">Electra &amp; Alea
          February 2001</font></p></td>
        </tr>
        <tr>
          <td colspan="2" align="left">
      <span style="font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
      I use my dads old digital Nikon D1H and I&#8217;m very happy with the digital
      development.
      </span></td>
        </tr>
        <tr>
          <td colspan="2" align="left">
          <span style="font-family: Arial; color: rgb(204, 204, 204);" lang="EN-GB">
          Even though I&#8217;m getting orders now, photography will never be my
          profession. Horses and photography are two hobbies I have integrated.</span></td>
        </tr>
      </tbody></table>
    </div>
    </td>
  </tr>
</tbody></table>

</div>

<p style="text-align:center;margin-top:40px;"><b><font face="verdana" size="2">© 2007 Copyright Julie
Agersten - All rights reserved</font></b></p>

</body></html>
Avatar billede agersten Nybegynder
16. februar 2007 - 21:26 #6
men hvis jeg siger nej til scroll i min iframe, kan en læser jo slet ikke scrolle på siden i brødteksten?
Avatar billede agersten Nybegynder
16. februar 2007 - 21:27 #7
nøj vi skriver lidt oveni hinanden - jeg bruger en iframe, fordi det styrer størrelsen på hjemmesiden, så den ikke ændrer sig på de forskellige computere - eller er jeg helt gal på den?
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:28 #8
Joh, i den div som du har sat ind - ved at scrolle div'en istedet for siden scrolles venstre panel ikke med - venstre panel kan også fastgøres med position:fixed; ... men det virker ikke i IE under 7, og kan derfor blive en mere langhåret med flere elementer for at understøtte IE 6 også.
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:30 #9
21:27:45: Ja, du kan bare definere størrelsen på elementet du bruger som i mit test eksempel... Prøv det af og vurder om frames er nødvendigt. Uden frames bliver søgemaskinerne også mere glade for dig :o)
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:32 #10
M.h.t. det du har nu, ja så skal du stadig bruge de css rettelser, som jeg kom med i 21:05:01 (dit baggrundsbillede skal dog lige rettes til - da det ikke lægger under 123_files :D), men prøv test eksemplet i 21:24:35 først. Den farvede ramme rundt om indholdet kan selvfølgelig flyttes, rokeres eller andet.
Avatar billede agersten Nybegynder
16. februar 2007 - 21:37 #11
He he sidder og kigger i dit teksteksempel, puha der er meget kode for et utrænet øje! det eksempel, du har lagt ind, gælder for siden "biography" eller hvordan? For for mig ser det ud som om, der er lagt to sider sammen? "front" og "Biography" - jeg har intet imod at droppe mine frames, så længe jeg kan sætte en fast størrelse på min side, så den ikke bliver grim!
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:41 #12
'For for mig ser det ud som om, der er lagt to sider sammen? "front" og "Biography"'
Ja, det gik vist lidt hurtigt :D. Men, det skulle gerne være selve framesiden og så biography.

"Så længe jeg kan sætte en fast størrelse på min side, så den ikke bliver grim!"
Det kan du altid. Det er bare at definere en width og så måske køre margin:0px auto; så elementet bliver centreret på skærmen.

"He he sidder og kigger i dit teksteksempel, puha der er meget kode for et utrænet øje!" Senere er det nok en god ide at rydte lidt ud i markup'en og kaste noget mere over i css, som f.eks. de font tags og undgå så vidt muligt align attributten, men brug f.eks. det med margin eller text-align:left; eller right eller center.
Avatar billede agersten Nybegynder
16. februar 2007 - 21:42 #13
hvis jeg nu sætter dit eksempel ind i en ny side, kommer baggrundsbilldet ikke frem (stien passer) heller ikke selvom jeg sætter et css link ind.
Der er en super scroll inde ved brødteksten, men der er stadig en "stor" scroll ude i siden, og siden er for stor, men det kan jo hurtigt rettes.
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:43 #14
Må jeg kigge med ?
Avatar billede agersten Nybegynder
16. februar 2007 - 21:47 #15
hvad tænker du på? at jeg lægger den online?
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:47 #16
Læg mærke til at jeg har skrevet /images så hvis det skal virke
lokalt kan det godt ske at /images blot skal være images.

... Min html {overflow:auto;} burde have fjernet den store scroller
... men den er der vist i FF, prøv lige at kaste:
p {margin:0px;}
ind i style delen.
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:48 #17
"nøj vi skriver lidt oveni hinanden" ... Ja, en smule ;o)

"hvad tænker du på? at jeg lægger den online?"
Ja, men du kan prøve med det i 21:47:12 inden :)
Avatar billede agersten Nybegynder
16. februar 2007 - 21:48 #18
Mærkeligt! nu lagde jeg den online, og det meste passer... *G*
Avatar billede agersten Nybegynder
16. februar 2007 - 21:51 #19
jeg har lagt den ind her: <style type="text/css">
html,body {margin:0px;padding:0px;}
html {overflow:auto;}
p {margin:0px;}
#main {background:url('/Images/Baggrunde/Baggrund2.gif') #373737 no-repeat 50% 0;height:520px;position:relative;}
</style></head><body>

og uploadet det, men der er stadig scrolls?
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:51 #20
F5
Avatar billede mclemens Nybegynder
16. februar 2007 - 21:56 #21
Der er en enkel sti på et billede af en af hestene,
der er forkert, jeg ved ikke lige hvad stien skulle være ...
Avatar billede agersten Nybegynder
16. februar 2007 - 22:05 #22
jeg har rettet billedstien nu. men på min skærm har jeg stadig store scrolls? hvor skal jeg ændre i teksten for at lave det mindre? man kan fx ikke se "all rights reserved" uden at scrolle og det er også for bredt
Avatar billede mclemens Nybegynder
16. februar 2007 - 22:08 #23
Hvilken opløsning kører du i ? 1024 x 768 eller ?
Jeg kører 1024x768 og kan godt se det hele ...
Avatar billede agersten Nybegynder
16. februar 2007 - 22:10 #24
prøver lige at åbne vores anden computer, for nogen gange vil min ikke opdatere ordentligt, før den er genstartet :( kører også i 1024 x 768
Avatar billede mclemens Nybegynder
16. februar 2007 - 22:12 #25
Avatar billede agersten Nybegynder
16. februar 2007 - 22:16 #26
Jep, det gør den også i firefox på den aden pc ;)
Avatar billede agersten Nybegynder
16. februar 2007 - 22:22 #27
Nå men det ser jo ud til, jeg kan arbejde videre med din løsning, så jeg siger tusind tak! og så vil jeg gerne give dig dine point ;)
Avatar billede mclemens Nybegynder
16. februar 2007 - 22:22 #28
Velbekomme, og tak for point
- her er lige et svar :o)

Held og lykke med sitet ;)
Avatar billede mclemens Nybegynder
16. februar 2007 - 22:22 #29
Ups, prøver lige igen ...
Avatar billede agersten Nybegynder
16. februar 2007 - 22:23 #30
Mange tak og god weekend!! :D
Avatar billede mclemens Nybegynder
16. februar 2007 - 22:25 #31
I lige måde :D
Avatar billede agersten Nybegynder
17. februar 2007 - 01:08 #32
ARGH! Mega vild panik - prøv lige at ta et kig rundt på siderne, hvis du læser dette!
Den side, som vi begge fik til at kopiere, har jeg bare kopieret de andre sider over på og gemt under diverse navne... den lille fine scroll i div virker ikke, der er store scrolls og øv øv øv!!
Hjælp!!
Alle links er aktivieret på www.julie-agersten.dk
Avatar billede agersten Nybegynder
17. februar 2007 - 01:09 #33
"som vi begge fik til at fungere" even
Avatar billede mclemens Nybegynder
17. februar 2007 - 13:27 #34
Hvis du kigger på:
<div style="float:right;margin-top:60px;width:665px;height:791px;overflow:auto; padding-left:0px; padding-right:0px; padding-top:10px; padding-bottom:10px">

Så var den jeg skrev:
<div style="padding: 10px 0px; overflow: auto; float: right; margin-top: 60px; width: 665px; height: 290px;">

... D.v.s. du har retter på height - når du retter på noget så gør det ligeså stille, husk hvad du retter og hold øje med effekten. I dette tilfælde har du ændret højden fra 310px (inklusiv de 2x10px padding) over til 811px (inklusiv de 2 x 10 px padding).

...

Du kan godt øge højden, men pas på med hvor meget du øger højden.

#main {background:url('Images/Baggrunde/Baggrund2.gif') #373737 no-repeat 50% 0;height:570px;position:relative;}

...

<div style="padding: 10px 0px; overflow: auto; float: right; margin-top: 60px; width: 665px; height: 370px;">

...

<p style="text-align: center; margin-top: 5px;"><b><font face="verdana" size="2">©
2007 Copyright Julie Agersten - All rights reserved</font></b></p>
Avatar billede mclemens Nybegynder
17. februar 2007 - 14:13 #35
Til senere hvor du vil eksperimentere lidt kan du kigge på nedenstående.

... Du kan også istedet for alt det andet - oprette et div lag i toppen med et højt z-index, hvor du lægger dit logo med position:fixed;. Giver menuen i højre side position:fixed;. Tager den indholds div og fjerner størrelse - overflow m.v samt giver den et lavt z-index.. Fjerner html's overflow: auto;. Så vil du have en stor standard scroller i siden, og når du scroller op vil teksten forsvinde ind under dit logo - og ikke hen over det. Dog vil copyright noten stå nede i bunden af siden - men du kan også placere den med position:absolute; og bottom:0px; samt fixed. Og så give teksten med hestene lidt bund padding.

- Men, hvis du går igang med at lege med en sådan løsning skal jeg sige at IE under 7 ikke understøtter position:fixed; så der vil du opleve at alt indholdet scroller med opad, men de fleste bør nok snart få opdateret til IE7 ... forhåbentlig.
Avatar billede 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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

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