/ 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 og bokse
Fra : Mark Thomas Gazel


Dato : 02-02-06 14:57

Hej

Jeg roder stadig med dette website.

http://www.kulturvesterbro.dk/?page_id=4

Lige nu roder jeg med bokse. Det er skabelon jeg sidder og retter til.

Oprindeligt var boksen Undersider (Sidebar) til højre og indholdsboksen
(Noticias. Ja, det hedder den) til venstre. Det fungerede fint med
henholdsvis float:left og float:right.

Men selvfølgelig var det ikke så nemt, at jeg bare kunne bytte om på de to.
Jeg flyttede selvfølgelig div, så Sidebar kom før i flowet. Jeg justerede
lidt og nu bruger jeg kun float:left på Sidebar.

Egentligt er det jo fint nok, men footeren vil jo gerne lidt for langt op og
jeg vil have den til at blive under den højeste af de sidestillede bokse.
Eller den der rager længst ned.

Hvad er løsningen? At wrappe Sidebar og Noticias i en div for sig selv? Der
er faktisk en div, der hedder bloque, der ikke har en style i stylesheetet,
så måske har designeren været så forudseende - at det kunne man (jeg) få
brug for på et tidspunkt. Er det den i css-sammenhæng "rigtige" måde at gøre
det på?

Et andet problem er, at i Firefox går det helt galt. Der overlapper både
Footer og Noticias Sidebar boksen, så der er noget i vejen der.

En sidste ting er at designeren har lavet følgende, som jeg har været nødt
til at ghoste, for det lavede nogle lidt uforudsigelige ting.

/* Float and Clear
div.floatleft {
float: left;
}

div.floatright {
float: right;
}

div.both {
clear: both;
}
*/

Jeg troede det var tekstværktøjer til at formattere tekst og lave det
henholdsvis højre og venstrestille ,når der var brug for det. Men det laver,
som sagt, ballade.

Jeg håber på svar. På i hvert fald nogle tingene.


--
Med venlig hilsen

Mark



 
 
Ukendt (02-02-2006)
Kommentar
Fra : Ukendt


Dato : 02-02-06 16:36


"Mark Thomas Gazel" <markgazel@hotmail.com> skrev i en meddelelse
news:d0490$43e20fb5$3e3d8e23$5345@news.arrownet.dk...

> Oprindeligt var boksen Undersider (Sidebar) til højre og indholdsboksen
> (Noticias. Ja, det hedder den) til venstre. Det fungerede fint med
> henholdsvis float:left og float:right.

Det er altså ikke så særligt smart at bruge så ikke sigende navne. Det
vanskeliggør fejlfinding, da elementerne ikke er tildelt nogle sigende
classer og id'er.
I øvrigt roder dit stilark noget. Nogle af de første angivelser bliver
overskrevet af de sidste. Så få slettet alt det overflødige.

> Men selvfølgelig var det ikke så nemt, at jeg bare kunne bytte om på de
> to. Jeg flyttede selvfølgelig div, så Sidebar kom før i flowet. Jeg
> justerede lidt og nu bruger jeg kun float:left på Sidebar.

Du skal have float:left på din sidebar, som du har allerede har

> Egentligt er det jo fint nok, men footeren vil jo gerne lidt for langt op
> og jeg vil have den til at blive under den højeste af de sidestillede
> bokse. Eller den der rager længst ned.

sæt clear: both; på din footer og den vil placere sig under det øvrige

> Et andet problem er, at i Firefox går det helt galt. Der overlapper både
> Footer og Noticias Sidebar boksen, så der er noget i vejen der.

Jeg har testet i firefox, hvordan løsningen ser ud i øvrige browsere ved jeg
ikke. Det luft du muligvis får melem elementerne skyldes dine margin
angivelser.

Den sidste del af dit stilark kan så vidt jeg kan se undværes helt. Men test
det selv


--
Med venlig hilsen - Carsten Sørensen

Gode råd til webdesigneren - http://csnet.dk/html/
Nørholm Forsamlingshus - http://forshus.dk



Mark Thomas Gazel (02-02-2006)
Kommentar
Fra : Mark Thomas Gazel


Dato : 02-02-06 18:03

>> Oprindeligt var boksen Undersider (Sidebar) til højre og indholdsboksen
>> (Noticias. Ja, det hedder den) til venstre. Det fungerede fint med
>> henholdsvis float:left og float:right.
>
> Det er altså ikke så særligt smart at bruge så ikke sigende navne. Det
> vanskeliggør fejlfinding, da elementerne ikke er tildelt nogle sigende
> classer og id'er.

Du har helt ret. Jeg omdøber tingene til noget mere fornuftigt og rydder
op i stilarket.

> I øvrigt roder dit stilark noget. Nogle af de første angivelser bliver
> overskrevet af de sidste. Så få slettet alt det overflødige.

Det vil jeg også gøre. Som sagt, er det noget en anden har lavet og jeg
har også en fornemmelse af, at der er en del overflødig eller
redundant kode.

>> Men selvfølgelig var det ikke så nemt, at jeg bare kunne bytte om på de
>> to. Jeg flyttede selvfølgelig div, så Sidebar kom før i flowet. Jeg
>> justerede lidt og nu bruger jeg kun float:left på Sidebar.
>
> Du skal have float:left på din sidebar, som du har allerede har

Ok.

>> Egentligt er det jo fint nok, men footeren vil jo gerne lidt for langt op
>> og jeg vil have den til at blive under den højeste af de sidestillede
>> bokse. Eller den der rager længst ned.
>
> sæt clear: both; på din footer og den vil placere sig under det øvrige

Ahh ... bonk! Jeg vidste det var en clear, men troede den skulle på
de bokse, der kom *før* footeren, og det virkede ikke.

>> Et andet problem er, at i Firefox går det helt galt. Der overlapper både
>> Footer og Noticias Sidebar boksen, så der er noget i vejen der.
>
> Jeg har testet i firefox, hvordan løsningen ser ud i øvrige browsere ved
> jeg ikke. Det luft du muligvis får melem elementerne skyldes dine margin
> angivelser.

Det er ikke luft. Midterkassen sidder halvt inde Sidebar.

> Den sidste del af dit stilark kan så vidt jeg kan se undværes helt. Men
> test det selv

Ok. Tak for hjælpen.


--
Med venlig hilsen

Mark



Ukendt (02-02-2006)
Kommentar
Fra : Ukendt


Dato : 02-02-06 20:07


"Mark Thomas Gazel" <cafesletmig@kulturhuset.dk> skrev i en meddelelse
news:43e23b55$0$209$edfadb0f@dread16.news.tele.dk...

> Du har helt ret. Jeg omdøber tingene til noget mere fornuftigt og rydder
> op i stilarket.

God ide

>> I øvrigt roder dit stilark noget. Nogle af de første angivelser bliver
>> overskrevet af de sidste. Så få slettet alt det overflødige.
>
> Det vil jeg også gøre. Som sagt, er det noget en anden har lavet og jeg
> har også en fornemmelse af, at der er en del overflødig eller
> redundant kode.

også fornufigt

> Det er ikke luft. Midterkassen sidder halvt inde Sidebar.

Der var jeg måske hurtigt nok. Burde du også kunne løse med float: lett på
elementet; eller en passende margin angivelse


--
Med venlig hilsen - Carsten Sørensen

Gode råd til webdesigneren - http://csnet.dk/html/
Nørholm Forsamlingshus - http://forshus.dk



Mark Thomas Gazel (02-02-2006)
Kommentar
Fra : Mark Thomas Gazel


Dato : 02-02-06 20:56

>> Det er ikke luft. Midterkassen sidder halvt inde Sidebar.
>
> Der var jeg måske hurtigt nok. Burde du også kunne løse med float: lett på
> elementet; eller en passende margin angivelse

Jeg prøver.

Giver denne style i øvrigt mening?

div.both {
clear: both;
}

Er det en class eller en ID? Og hvorfor hedder den div?

Kunne den være tiltænkt footeren? I hvert slog jeg den fra.

Jeg hører gerne om (eller et bud på), hvad tanken er bag den style.


--
Med venlig hilsen

Mark




Ukendt (02-02-2006)
Kommentar
Fra : Ukendt


Dato : 02-02-06 22:46


"Mark Thomas Gazel" <cafesletmig@kulturhuset.dk> skrev i en meddelelse
news:43e263ce$0$156$edfadb0f@dread16.news.tele.dk...

> Giver denne style i øvrigt mening?
>
> div.both {
> clear: both;
> }

Den giver udemærket mening, bare en lidt sjov måde man har valgt at gøre det

> Er det en class eller en ID? Og hvorfor hedder den div?

Det er en class, læg mærke til punktumet. Den hedder div fordi den tilhører
en div, men den kunne ligeså godt bare have heddet .both, hvilket vil have
virket på samme måde.

> Kunne den være tiltænkt footeren? I hvert slog jeg den fra.

Kommer jo an på hvilken div den står i forbindelse med


--
Med venlig hilsen - Carsten Sørensen

Gode råd til webdesigneren - http://csnet.dk/html/
Nørholm Forsamlingshus - http://forshus.dk



Jørgen Farum Jensen (02-02-2006)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 02-02-06 23:53

Mark Thomas Gazel wrote:
>>>Det er ikke luft. Midterkassen sidder halvt inde Sidebar.
>>
>>Der var jeg måske hurtigt nok. Burde du også kunne løse med float: lett på
>>elementet; eller en passende margin angivelse
>
>
> Jeg prøver.
>
> Giver denne style i øvrigt mening?
>
> div.both {
> clear: both;
> }
>
> Er det en class eller en ID? Og hvorfor hedder den div?
>
> Kunne den være tiltænkt footeren? I hvert slog jeg den fra.
>
> Jeg hører gerne om (eller et bud på), hvad tanken er bag den style.
>
>

clear:both sørger for, at det element, der er forsynet med denne
egenskab, flyder ned under foranstående elementer, uanset om de
er float'et left eller right.


Den bruges ofte i forbindelse med en footer, der altid skal
stå under de float'ede kolonner oven over.

F.eks.

<div class="both"></div>

Benyttes dette bør stylesheet formdeklarationen dog udvides til

div.both {
clear:both;
height:0;
line-height:0;
font-size:0;
}
--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

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