|
|
 | Placering af elementer
Fra : Lisbet Laursen |
Dato : 14-05-08 01:37 |
|
http://rudholm.dk/rudholm2/index3.html
Jeg må have stirret mig blind, for jeg kan ikke finde årsagen til at
siden ser så fjollet ud. Meningen er jo at der foruden banner og
navbar skal være indhold (til venstre) og rightcol og til sidst en
sidefod. Html og css validerer.
Desuden undrer det mig at de to menupunkter i navbar som har
undermenupunkter, har en anden farve end de andre. Jeg kan ikke finde
noget i css som siger at de skal have det.
Mvh. Lisbet
| |
 Erik Ginnerskov (14-05-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 14-05-08 05:30 |
|
Lisbet Laursen wrote:
> Meningen er jo at der foruden banner og
> navbar skal være indhold (til venstre) og rightcol og til sidst en
> sidefod. Html og css validerer.
Problemet ligger i din sideopbygning. Skal du opnå det, du ønsker, skal du
inddele den i kasser, som du så stabler i den ønskede opsætning:
<body>
<div id="page">
<div id="banner">
Indhold i banner
</div>
<div id="navbar">
Indhold i navbar
</div>
<div id="indhold">
<div id="leftcol">
Indhold i venstre kolonne
</div>
<div id="rightcol>
Indhold i højre kolonne
</div>
</div> <!-- #indhold -->
<div id="footer">
Indhold i footer
</div>
</div> <!-- #page -->
</body>
I css floater du #leftcol mod venstre #footer clearer du, så den går fri af
indhold:
#leftcol {
float: left;
width: 460px;
}
#footer {
clear: both;
}
PS. Husk at få ændret din sides titel, så den ikke angiver af være en del af
Webdesign101.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk
| |
Lisbet Laursen (14-05-2008)
| Kommentar
Fra : Lisbet Laursen |
Dato : 14-05-08 07:51 |
|
Erik Ginnerskov wrote:
> Lisbet Laursen wrote:
>
>> Meningen er jo at der foruden banner og
>> navbar skal være indhold (til venstre) og rightcol og til sidst en
>> sidefod. Html og css validerer.
>
> Problemet ligger i din sideopbygning. Skal du opnå det, du ønsker,
> skal du inddele den i kasser, som du så stabler i den ønskede
> opsætning:
Mange tak, det vil jeg prøve. Mit problem er kommet af at jeg har
forsøgt at kombinere to skabeloner fra Webdesign101.
> PS. Husk at få ændret din sides titel, så den ikke angiver af være
> en
> del af Webdesign101.
Ja, ups - det var en smutter og er rettet.
Mvh. Lisbet
| |
Lisbet Laursen (14-05-2008)
| Kommentar
Fra : Lisbet Laursen |
Dato : 14-05-08 12:48 |
|
Erik Ginnerskov wrote:
> Problemet ligger i din sideopbygning. Skal du opnå det, du ønsker,
> skal du inddele den i kasser, som du så stabler i den ønskede
> opsætning
Jeg takker for vejledningen som bragte mig på rette spor.
Dog har jeg stadig problemer med rightcol som i FF rykker ned under
leftcol hvis ikke jeg laver <br />i flg. tekst: "Gården ligger ved
Årre i nærheden af Esbjerg og Varde." Det sker ikke i IE 6 og 7.
Jeg har forsøgt med forskellige bredder, men er ikke nået frem til en
løsning.
Forhåbentlig kan jeg også få hjælp hertil?
Mvh. Lisbet
| |
 Jørgen Farum Jensen (14-05-2008)
| Kommentar
Fra : Jørgen Farum Jensen |
Dato : 14-05-08 13:31 |
|
Lisbet Laursen skrev:
> Dog har jeg stadig problemer med rightcol som i FF rykker ned under
> leftcol hvis ikke jeg laver <br />i flg. tekst: "Gården ligger ved
> Årre i nærheden af Esbjerg og Varde." Det sker ikke i IE 6 og 7.
>
> Jeg har forsøgt med forskellige bredder, men er ikke nået frem til en
> løsning.
>
> Forhåbentlig kan jeg også få hjælp hertil?
Jeg kan ikke lige se hvor det er du sætter
en bredde på #rightcol, men det er sådan
set ligemeget:
div#rightcol {
/*float:left;*/
margin:0;
padding-left:3em;
}
Det vil sige, at du skal fjerne float-egenskaben
fra #rightcol-elementet. Så flyder dette element
op på højre side af #leftcol, hvis der er plads
inden for rammerne af det overordnede element.
--
Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..
| |
Lisbet Laursen (14-05-2008)
| Kommentar
Fra : Lisbet Laursen |
Dato : 14-05-08 21:09 |
|
Lisbet Laursen wrote:
> http://rudholm.dk/rudholm2/index3.html
Endnu et spørgsmål om placering: hvordan får jeg leftcol og rightcol
til at stå med lige lang afstand fra navbar?
Jeg har forsøgt med padding-bottom på content og nu med padding-top
på leftcol og rightcol, men den ene bliver ved med at være højere
oppe end den anden.
Mvh. Lisbet
| |
Erik Ginnerskov (15-05-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 15-05-08 05:36 |
| | |
Jørgen Farum Jensen (15-05-2008)
| Kommentar
Fra : Jørgen Farum Jensen |
Dato : 15-05-08 10:09 |
| | |
Lisbet Laursen (17-05-2008)
| Kommentar
Fra : Lisbet Laursen |
Dato : 17-05-08 14:24 |
|
Jørgen Farum Jensen wrote:
> Lisbet Laursen skrev:
>> Lisbet Laursen wrote:
>>> http://rudholm.dk/rudholm2/index3.html
>>
>> Endnu et spørgsmål om placering: hvordan får jeg leftcol og
>> rightcol
>> til at stå med lige lang afstand fra navbar?
>>
>
> Det er et lidt tricky problem, du der er rendt ind i,
> og derfor har jeg skrevet temmelig meget om det i
> artiklen:
> http://webdesign101.dk/layout/eksempel2.php
>
> Bemærk især afsnittene "Layout" og "En note om
> spalternes position".
Tak til både Erik Ginnerskov og Jørgen Farum Jensen for jeres
forslag. Jeg har lige p.t. ikke så meget tid til at bikse videre (og
er lidt træt af endnu en gang at have sagt ja til at udføre den slags
vennetjeneste - men synes alligevel det er lidt sjovt, især når det
forhåbentlig endelig lykkes med med megen hjælp fra
webdesign-grupperne), men vil have forslagene in mente når jeg
fortsætter.
Mvh. Lisbet
| |
Lisbet Laursen (18-05-2008)
| Kommentar
Fra : Lisbet Laursen |
Dato : 18-05-08 16:58 |
|
Lisbet Laursen wrote:
> Lisbet Laursen wrote:
>> http://rudholm.dk/rudholm2/index3.html
>
> Endnu et spørgsmål om placering: hvordan får jeg leftcol og
> rightcol
> til at stå med lige lang afstand fra navbar?
Af en eller anden grund lykkes det bedre med ens afstand på flg. side
(som også er baseret på et layout fra Webdesign101):
http://rudholm.dk/rudholm2/index5.html. Så det ender nok med at jeg
bruger dette.
Layoutet er forskelligt derved at "right" floater right, har jeg
foreløbig fundet ud af. I index.3 floater "leftcol" left.
Mvh. Lisbet
| |
Erik Ginnerskov (18-05-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 18-05-08 17:11 |
| | |
Erik Ginnerskov (18-05-2008)
| Kommentar
Fra : Erik Ginnerskov |
Dato : 18-05-08 17:55 |
|
Erik Ginnerskov wrote:
> <!--[if lt IE 7]>
> indlæs css for IE 6 (og ældre)
> <![endif]-->
Jeg har nu på en anden maskine med Developer Toolbar på IE 6 (det kan jeg
ikke på min primære maskine, der kører IE 7) kigget nærmere på problemet.
Sætter du float:left på billedet af koen, kommer billedet op på plads - men
stadig kun for IE'er ældre end 7'eren.
--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://vestfynswebdesign.dk - http://html-faq.dk
| |
Lisbet Laursen (18-05-2008)
| Kommentar
Fra : Lisbet Laursen |
Dato : 18-05-08 21:34 |
|
Erik Ginnerskov wrote:
> Erik Ginnerskov wrote:
>
>> <!--[if lt IE 7]>
>> indlæs css for IE 6 (og ældre)
>> <![endif]-->
>
> Jeg har nu på en anden maskine med Developer Toolbar på IE 6 (det
> kan
> jeg ikke på min primære maskine, der kører IE 7) kigget nærmere på
> problemet.
> Sætter du float:left på billedet af koen, kommer billedet op på
> plads
> - men stadig kun for IE'er ældre end 7'eren.
Jeg har i stedet forsøgt med padding-right=0 på "left", og det ser ud
til at løse problemet ifølge Total Validator med screenshot af IE6.
Og det ser ikke ud til at ødelægge noget andet, så vidt jeg kan se?
Mvh. Lisbet
| |
|
|