/ 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
fast top img og top menu med css
Fra : Lisbeth Schillig


Dato : 09-08-08 21:15

Hej.
Jeg forsøger at lave et meget traditionelt sidelayout med en
topbjælke med et billede, derunder en menubjælke og derunder
selve indholdsdelen (og så nederst en bjælke igen).
Fidusen er selvfølgelig at hvis indholdsdelen indeholder mere end
der kan vises skal man kunne scrolle og rulle ned gennem teksten.
det driller dog og jeg kan simpelthen ikke finde fejlen.
http://www.tinderbox.dk/pages/akantus/akantus.php kan I se
problemet og min css kode er her:

@charset "utf-8";
body{
   font-family: Verdana, Arial, Helvetica, sans-serif;
   color: #000033;
   font-size: 14px;
   background-color: #333333;
}
#tinderbox_img {
   position: fixed;
   top:3px;
   width:828px;
   height:115px;
   z-index:1;
   background-color: #C0C0C0;
   margin-top: 0px;
   margin-right: auto;
   margin-bottom: 0px;
   margin-left: auto;
}
#menu_top {
   background-color: #CC6600;
   border-top-width: thin;
   border-bottom-width: thin;
   border-top-style: solid;
   border-right-style: none;
   border-bottom-style: solid;
   border-left-style: none;
   border-top-color: #000033;
   border-bottom-color: #000033;
   font-weight: bold;
   padding-top: 2px;
   padding-right: 2px;
   padding-bottom: 2px;
   padding-left: 15px;
   margin-right: auto;
   margin-left: auto;
   width: 815px;
}
#main {
   width: 830px;
   height: 620px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 14px;
   font-weight: bold;
   color: #000033;
   background-color: #ECECEC;
   margin-right: auto;
   margin-left: auto;
}
#sidemenu {
   font-weight: bold;
   float: right;
   list-style-type: none;
   padding-left: 3px;
   background-color: #CCCCCC;
   height: 400px;
}
a:link {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 14px;
   font-weight: bold;
   color: #000033;
}
a:active {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-weight: bold;
   color: #006600;
   font-size: 14px;
}
a:visited {
   color: #000033;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 14px;
   font-weight: bold;
}
a:hover {
   background-color: #B3D0F4;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 14px;
   font-weight: bolder;
}
#footer {
   background-color: #CC6600;
   border-top-width: thin;
   border-top-style: solid;
   border-top-color: #000033;
   font-weight: bold;
   padding: 2px;
   margin-right: auto;
   margin-left: auto;
   margin-top: 0px;
   margin-bottom: 0px;
   width: 830px;
   border-bottom-width: thin;
   border-right-style: none;
   border-bottom-style: solid;
   border-left-style: none;
   border-bottom-color: #000033;
}

Håber der er én der kan spotte fejlen og forklare mig hvad der er
galt.

På forhånd tak
:0)
Lisbeth

--
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

 
 
jopa (09-08-2008)
Kommentar
Fra : jopa


Dato : 09-08-08 22:08

"Lisbeth Schillig" <fam.schillig@gmail.com> skrev

> Jeg forsøger at lave et meget traditionelt sidelayout med en
> topbjælke med et billede, derunder en menubjælke og derunder
> selve indholdsdelen (og så nederst en bjælke igen).

Hejsa prøv først at fjerne fejlene i din kode så er det lettere at hjælpe.
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.tinderbox.dk%2Fpages%2Fakantus%2Fakantus.php

Sådan ser din side ud her:
http://jp-web.dk/test.jpg

Set med FF

Prøv evt at smide hele indholdet i en centreret div.



--
Mvh. John
www.jp-web.dk
www.web-graphic.dk


Lisbeth Schillig (10-08-2008)
Kommentar
Fra : Lisbeth Schillig


Dato : 10-08-08 19:35

jopa wrote in dk.edb.internet.webdesign.html:

> Hejsa prøv først at fjerne fejlene i din kode så er det lettere at hjælpe.
> http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.tinderbox.dk%2Fpages%2Fakantus%2Fakantus.php

Nej... Sikke en smart én :0D jeg anede ikke man kunne teste sin side sådan. Tak fro tippet - jeg ser der er
en del rettelser at foretage.

> Prøv evt at smide hele indholdet i en centreret div.

hmm, ja, det havde jeg faktisk i starten, men jeg vil jo gerne have at "Tinderbox" og top menuen bliver
stående og teksten så starter der under og om nødvendigt kan scrolles ud under menuen og Tinderbox. Det
kunne jeg ikke få til at fungere. Burde det kunne lade sig gøre med kun Tinderbox som AP fixed og de øvrige
elementer bare alm div?

:0)
Lisbeth

--
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

jopa (10-08-2008)
Kommentar
Fra : jopa


Dato : 10-08-08 20:47

"Lisbeth Schillig" <fam.schillig@gmail.com> skrev
>
> hmm, ja, det havde jeg faktisk i starten, men jeg vil jo gerne have at
> "Tinderbox" og top menuen bliver
> stående og teksten så starter der under og om nødvendigt kan scrolles ud
> under menuen og Tinderbox. Det
> kunne jeg ikke få til at fungere. Burde det kunne lade sig gøre med kun
> Tinderbox som AP fixed og de øvrige
> elementer bare alm div?

Alle elementerne kan laves som <div>
-------------------------------------------
<div id="ramme">
som skal omkrandse hele skidtet og være centreret.

#ramme {

width: 830px;
margin: 0px auto;
-----------------------------------------

<div id="header">

<div id="menu">

<div id="indhold">

<div id="footer">

Ønsker du scroll i dit tekstfelt kan du give det en class i stedet

<div class="scroll">
med overflow: auto;

Håber jeg har forstået dit ? rigtigt

Fatter forøvrigt ikke hvad du skal bruge z-index til.

Selve designet er så enkelt og simpelt at det kan laves med 3-4 <div>s


--
Mvh. John
www.jp-web.dk
www.web-graphic.dk




Lisbeth Schillig (11-08-2008)
Kommentar
Fra : Lisbeth Schillig


Dato : 11-08-08 07:54

jopa wrote in dk.edb.internet.webdesign.html:

> Ønsker du scroll i dit tekstfelt kan du give det en class i stedet
>
> <div class="scroll">
> med overflow: auto;
Aha- vil det sige at jeg slet ikke skal bruge et AP div for at undgå at
header delen scroller ud af skærmen, men i stedet definere at indholdsdelen
skal have en scroll?

> Fatter forøvrigt ikke hvad du skal bruge z-index til.

Næ, heller ikke jeg - den kom bare sådan lige med ;0)

> Selve designet er så enkelt og simpelt at det kan laves med 3-4 <div>s

Ja, det er også lavet med det formål endelig at lære kun at bruge div tags
og css.

Tusind tak for din hjælp.
:0)
Lisbeth

--
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

jopa (11-08-2008)
Kommentar
Fra : jopa


Dato : 11-08-08 15:04

"Lisbeth Schillig" <fam.schillig@gmail.com> skrev

> Aha- vil det sige at jeg slet ikke skal bruge et AP div for at undgå at
> header delen scroller ud af skærmen, men i stedet definere at
> indholdsdelen
> skal have en scroll?

Ved ikke hvad AP er , men ellers har du forstået det rigtigt

--
Mvh. John
www.jp-web.dk
www.web-graphic.dk


Lisbeth Schillig (11-08-2008)
Kommentar
Fra : Lisbeth Schillig


Dato : 11-08-08 19:35

jopa wrote in dk.edb.internet.webdesign.html:

>
> Ved ikke hvad AP er , men ellers har du forstået det rigtigt

Absolut Positionering... for dem der er lidt dovne på tastaturet. Det er
brugt i min "Dreamweaver - The missing Manual" så jeg troede lidt det var
CSS hardcore slang ;0)
Er spendt på om jeg kan få det til at virke nu.

:0)
Lisbeth

--
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

jopa (11-08-2008)
Kommentar
Fra : jopa


Dato : 11-08-08 19:48


"Lisbeth Schillig" <fam.schillig@gmail.com> skrev

> Er spendt på om jeg kan få det til at virke nu.

Selvfølgelig kan du det, men uden dreamweaver var det længe på plads

Brug af røvsygwyg editore er at gøre sig selv en bjørnetjeneste med mindre
man starter først uden ,og lærer sig basalt (X)HTML og CSS.
Er det på plads så gerne for mig, men foretrækker dog at arbejde bag
designet fremfor foran
Blot min mening og et sidespring


--
Mvh. John

www.web-graphic.dk





Lisbeth Schillig (12-08-2008)
Kommentar
Fra : Lisbeth Schillig


Dato : 12-08-08 12:56

Det virker - det virker :0D !!! og validering gav minsanten også grønt lys!

jopa wrote in dk.edb.internet.webdesign.html:
> Brug af røvsygwyg editore er at gøre sig selv en bjørnetjeneste med mindre
> man starter først uden ,og lærer sig basalt (X)HTML og CSS.

Jeg vil give dig fulstendigt ret. Jeg følte jeg havde meget mere styr på HTML
og CSS da jeg brugte Stones webwriter (men ak, dengang brugte jeg jo frames og
tabeller...) meeeen jeg må nu nok sige at Dreamweaver er så fedt at arbejde
med, ikke mindst når man begynder med php o.l.

:0)
Lisbeth


--
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 : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408849
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste