/ 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
css, html. Placerings problemer med divs
Fra : Jarl


Dato : 08-09-07 17:40

Hej alle sammen :)

Jeg har en side der består af: top(logo) div, menu div, content
div, google adds div og bottom(copyR) div. Siden ser helt fin ud
når man ser den i en høj opløsning men, browseren bliver for lav
så hopper content div ned under menuen, så siden bliver ødelagt.
i kan se siden her

http://www.kattehytten.hotserv.dk/divtest2.php

css fil her: http://www.kattehytten.hotserv.dk/styles/a.css

Da jeg ikke selv ved hvad problemet er håber jeg nogen kan hjælpe
Jeg har siddet og kæmpet med de her hele dagen igår og idag, og
kan simpelthen ikke få det til at fungere.

Venlig Hilsen Jarl



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

 
 
Peter Vesth (08-09-2007)
Kommentar
Fra : Peter Vesth


Dato : 08-09-07 17:58


>
> Da jeg ikke selv ved hvad problemet er håber jeg nogen kan hjælpe
> Jeg har siddet og kæmpet med de her hele dagen igår og idag, og
> kan simpelthen ikke få det til at fungere.

Hej Jarl

Jeg har prøvet at kikke på din css. Det er en one-liner som ingen
gider at læse, hvorfor editerer du den ikke, så den bliver mere
overskuelig. Jeg ved ikke hvilken editor du bruger, men det ville
være rart med noget mere læsbart.

Mvh.

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


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

Leonard (08-09-2007)
Kommentar
Fra : Leonard


Dato : 08-09-07 18:01

On 08 Sep 2007 16:57:57 GMT, Peter Vesth wrote:

> Jeg har prøvet at kikke på din css. Det er en one-liner som ingen
> gider at læse,

Hvad har du set den med?
Den blev fint vist formatteret i min Firefox, da jeg bare klikkede på
linket.
--
Leonard
Mine biler: http://vw.leonard.dk/

Peter Vesth (08-09-2007)
Kommentar
Fra : Peter Vesth


Dato : 08-09-07 18:11

Leonard wrote in dk.edb.internet.webdesign.html:
> On 08 Sep 2007 16:57:57 GMT, Peter Vesth wrote:
>
> Hvad har du set den med?
> Den blev fint vist formatteret i min Firefox, da jeg bare klikkede

> linket.
> --
> Leonard
> Mine biler: http://vw.leonard.dk/

Hej Leonard

Jeg bruger IE7, og er ved at læse css'en ned i min editor, måske ser
jeg den bedre der.

Mvh.

Peter Vesth

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

Jarl nimgaard (08-09-2007)
Kommentar
Fra : Jarl nimgaard


Dato : 08-09-07 18:45

tak for det fine svar peter :)
Jeg vil straks prøve og se om jeg kan få det til at fungere :)

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

Leonard (08-09-2007)
Kommentar
Fra : Leonard


Dato : 08-09-07 18:00

On 08 Sep 2007 16:40:06 GMT, Jarl wrote:

> Da jeg ikke selv ved hvad problemet er håber jeg nogen kan hjælpe

Du har en #auto - div, som holder sammen på hele dit indhold.
Hvis du nu giver den en passende width og fjerner margin-left på den, så
vil det nok se meget bedre ud.

Derudover fatter jeg ikke hvorfor du har puttet tabeller ind det, når du
nu er begyndt at bruge css og div. Det vil pynte en hel del påp din
kode, hvis du fjerner disse, de er totalt overflødige.

--
Leonard
Mine biler: http://vw.leonard.dk/

Jarl nimgaard (08-09-2007)
Kommentar
Fra : Jarl nimgaard


Dato : 08-09-07 18:49

Leonard wrote in dk.edb.internet.webdesign.html:
> On 08 Sep 2007 16:40:06 GMT, Jarl wrote:
>
> > Da jeg ikke selv ved hvad problemet er håber jeg nogen kan hjælpe
>
> Du har en #auto - div, som holder sammen på hele dit indhold.
> Hvis du nu giver den en passende width og fjerner margin-left på den, så
> vil det nok se meget bedre ud.
>
> Derudover fatter jeg ikke hvorfor du har puttet tabeller ind det, når du
> nu er begyndt at bruge css og div. Det vil pynte en hel del påp din
> kode, hvis du fjerner disse, de er totalt overflødige.
>
> --
> Leonard
> Mine biler: http://vw.leonard.dk/
Okay :)
Men margin-left, søre for at siden ikke er helt inde i venstre side :)
Men vil da prøve:)
tables er bare lavet for at vise lidt inhold på siden, det ligger i en
anden .php fil som bare er included :)
Har altid arbejdet med tables så det er lidt nyt for mig det er med divs
også derfor jeg har ¨haft så mange problemer med det :)

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

Leonard (08-09-2007)
Kommentar
Fra : Leonard


Dato : 08-09-07 19:27

On 08 Sep 2007 17:48:49 GMT, Jarl nimgaard wrote:

> Men margin-left, søre for at siden ikke er helt inde i venstre side :)

Med en fast bredde på #auto og margin: auto vil din side centreres og du
vil i store vinduer have en margin, mens der hvor der ikke er plads til
den tomme plads, vil pladsen blive udnyttet af dit indhold.

Jeg synes ikke din løsning er pæn som den er nu, men det er din side, så
bare du er tilfreds.

--
Leonard
Mine biler: http://vw.leonard.dk/

Jørgen Farum Jensen (08-09-2007)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 08-09-07 21:12

Jarl nimgaard skrev:

> Men margin-left, søre for at siden ikke er helt inde i venstre side :)
> Men vil da prøve:)
> tables er bare lavet for at vise lidt inhold på siden, det ligger i en
> anden .php fil som bare er included :)
> Har altid arbejdet med tables så det er lidt nyt for mig det er med divs
> også derfor jeg har ¨haft så mange problemer med det :)
>

Og det vil du fortsat have, hvis du blander
tabellayout med div-layout, Man skal være
en ørn til begge dele for at få det til
at lykkes.

Prøv at læse min artikel om CSS-layout:
http://webdesign101.dk/csslayout/float_layout.php
og kig på eksemplet:
http://webdesign101.dk/csslayout/ex/float_8.html



--

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

Jarl nimgaard (08-09-2007)
Kommentar
Fra : Jarl nimgaard


Dato : 08-09-07 18:57

Leonard wrote in dk.edb.internet.webdesign.html:
> On 08 Sep 2007 16:40:06 GMT, Jarl wrote:
>
> > Da jeg ikke selv ved hvad problemet er håber jeg nogen kan hjælpe
>
> Du har en #auto - div, som holder sammen på hele dit indhold.
> Hvis du nu giver den en passende width og fjerner margin-left på den, så
> vil det nok se meget bedre ud.
>
> Derudover fatter jeg ikke hvorfor du har puttet tabeller ind det, når du
> nu er begyndt at bruge css og div. Det vil pynte en hel del påp din
> kode, hvis du fjerner disse, de er totalt overflødige.
>
> --
> Leonard
> Mine biler: http://vw.leonard.dk/

Jeg skal bare have fundet ud af hvordan skal min menu i divs =)


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

Peter Vesth (08-09-2007)
Kommentar
Fra : Peter Vesth


Dato : 08-09-07 18:29

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

Jeg har læst din css ind, og rettet lidt til. Hvis du laver en div
noget i retning af denne, bemærk farver og placering, og pakker dit
indhold ind i denne, så er det måske din løsning. Bemærk også mit
forslag til margin-left og margin-right.

#side {
position: relative;   
float: left;
text-align:center;
top: 40px;
left: 127px;
width:770px;
height: 100%;
border: 0px solid #000000;
margin-left:auto;
margin-right:auto;
}

Her får du så hele din egen nuværende css

body {
margin-top:0px;
margin-bottom:10px;
background-color:#fff4ec;
font-family: verdana,'sans-serif','Vrinda';
font-size:10px;
}
#auto {
   margin:auto;
   margin-left:300px;
   clear:both;
}
#logo {
   background-image:url(../img/topbanner.jpg);
   width:781px;
   height:195px;
   background-repeat:no-repeat;
}
#menu {
   text-align:left;
   clear:both;
   background-color:#fafafa;
   border-style:none solid;
   border-width:1px;   
   border-color:#000000;
   float:left;
   width:137px;
   height:400px;
}
#content {
background-image:url(../img/contentbg.jpg);
float:left;
width:641px;
height:400px;
}
#googleadds {
float:left;
background-image:url(../img/googlebg.jpg);
background-repeat:no-repeat;
width:781px;
height:108px;
}
#copyR {
float:left;
background-image:url(../img/copyright.jpg);
background-repeat:no-repeat;
height:69px;
width:781px;
}

Mvh.

Peter Vesth

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


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

Jarl nimgaard (08-09-2007)
Kommentar
Fra : Jarl nimgaard


Dato : 08-09-07 18:46

Peter Vesth wrote in dk.edb.internet.webdesign.html:
> Jarl wrote in dk.edb.internet.webdesign.html:
>
> Jeg har læst din css ind, og rettet lidt til. Hvis du laver en div
> noget i retning af denne, bemærk farver og placering, og pakker dit
> indhold ind i denne, så er det måske din løsning. Bemærk også mit
> forslag til margin-left og margin-right.
>
> #side {
> position: relative;   
> float: left;
> text-align:center;
> top: 40px;
> left: 127px;
> width:770px;
> height: 100%;
> border: 0px solid #000000;
> margin-left:auto;
> margin-right:auto;
> }
>
> Her får du så hele din egen nuværende css
>
> body {
> margin-top:0px;
> margin-bottom:10px;
> background-color:#fff4ec;
> font-family: verdana,'sans-serif','Vrinda';
> font-size:10px;
> }
> #auto {
>    margin:auto;
>    margin-left:300px;
>    clear:both;
> }
> #logo {
>    background-image:url(../img/topbanner.jpg);
>    width:781px;
>    height:195px;
>    background-repeat:no-repeat;
> }
> #menu {
>    text-align:left;
>    clear:both;
>    background-color:#fafafa;
>    border-style:none solid;
>    border-width:1px;   
>    border-color:#000000;
>    float:left;
>    width:137px;
>    height:400px;
> }
> #content {
> background-image:url(../img/contentbg.jpg);
> float:left;
> width:641px;
> height:400px;
> }
> #googleadds {
> float:left;
> background-image:url(../img/googlebg.jpg);
> background-repeat:no-repeat;
> width:781px;
> height:108px;
> }
> #copyR {
> float:left;
> background-image:url(../img/copyright.jpg);
> background-repeat:no-repeat;
> height:69px;
> width:781px;
> }
>
> Mvh.
>
> Peter Vesth
>
> >
> > --
> > 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
>
>
> --
> 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

tak for det :) Går straks igang :)

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

Jarl nimgaard (08-09-2007)
Kommentar
Fra : Jarl nimgaard


Dato : 08-09-07 18:54

Peter Vesth wrote in dk.edb.internet.webdesign.html:
> Jarl wrote in dk.edb.internet.webdesign.html:
>
> Jeg har læst din css ind, og rettet lidt til. Hvis du laver en div
> noget i retning af denne, bemærk farver og placering, og pakker dit
> indhold ind i denne, så er det måske din løsning. Bemærk også mit
> forslag til margin-left og margin-right.
>
> #side {
> position: relative;   
> float: left;
> text-align:center;
> top: 40px;
> left: 127px;
> width:770px;
> height: 100%;
> border: 0px solid #000000;
> margin-left:auto;
> margin-right:auto;
> }
>
> Her får du så hele din egen nuværende css
>
> body {
> margin-top:0px;
> margin-bottom:10px;
> background-color:#fff4ec;
> font-family: verdana,'sans-serif','Vrinda';
> font-size:10px;
> }
> #auto {
>    margin:auto;
>    margin-left:300px;
>    clear:both;
> }
> #logo {
>    background-image:url(../img/topbanner.jpg);
>    width:781px;
>    height:195px;
>    background-repeat:no-repeat;
> }
> #menu {
>    text-align:left;
>    clear:both;
>    background-color:#fafafa;
>    border-style:none solid;
>    border-width:1px;   
>    border-color:#000000;
>    float:left;
>    width:137px;
>    height:400px;
> }
> #content {
> background-image:url(../img/contentbg.jpg);
> float:left;
> width:641px;
> height:400px;
> }
> #googleadds {
> float:left;
> background-image:url(../img/googlebg.jpg);
> background-repeat:no-repeat;
> width:781px;
> height:108px;
> }
> #copyR {
> float:left;
> background-image:url(../img/copyright.jpg);
> background-repeat:no-repeat;
> height:69px;
> width:781px;
> }
>
> Mvh.
>
> Peter Vesth
>
> >
> > --
> > 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
>
>
> --
> 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


Vil bare lige se at det virker nu :)

Men hvorfor må du ikke spørge mig om
Gjorte som du sagde peter, og det fungere perfekt:)

Men nogen der kan forklare mig hvorfor? =)
Er det pga position:relative; ? =)


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

Peter Vesth (08-09-2007)
Kommentar
Fra : Peter Vesth


Dato : 08-09-07 19:21

>Jarl nimgaard wrote in dk.edb.internet.webdesign.html:

>Men nogen der kan forklare mig hvorfor? =)
>Er det pga position:relative; ? =)

Hej Jarl
Det er noget med, at hvis man placerer sit ind position: relative, float
left, så gør browseren det. Derfor er det vigtigt, at man pakker sit
indhold ind i en ny div, det er i alle tilfælde noget i den retning.

Mvh.

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


--
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 : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408925
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste