|
| 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
på
> 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 (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
| |
|
|