Store CSS-problemer

pgdx · 9. november 2003

På denne siden har jeg en del problemer med utseendet i Opera.

Hvis de som har peiling på CSS og har Opera foran seg kan ta en titt?

CSS-filen følger:

/* CSS Document */

body {
color: #000000;
background: url("../img/bg.gif");
font-family: verdana;
font-size: x-small
}
#top {
}

#left {
width: auto;
height: 90%;
float: left;
padding-bottom:10px;
}
#right {
height: 90%;
padding-top: 35px;
padding-left: 50px;
}
#bottom { height: 10% }
H1 {
font-family: verdana;
text-decoration: underline;
font-size: medium;
color: #000088;
}
p {
color: #008800;
}
p.sangtittel {
text-transform: capitalize;
}
.albumpath {
font-size: xx-small;
}
ul {
list-style: circle;
}

A {
color: #000000;
text-decoration: underline;
}
A:Hover {
color: #ff0000;
}

Problemet er at når tekstene blir lengre enn menyen på venstre side, så wrapper de seg rundt den, om dere skjønner, bare se på en lang tekst.

I tillegg får jeg ikke paddingen til å fungere. Slik at i Opera er teksten helt inntil menyen.

pgdx · 9. november 2003

/* CSS Document */
#left {
width: auto;
height: 90%;
float: left;
padding-bottom:10px;
}
#right {
height: 90%;
padding-top: 35px;
padding-left: 50px;
}

Problemet ligger altså i #right, der de to paddingene ikke virker, og i tillegg, så går ikke #left helt ned på venstre siden.

dms · 9. november 2003

Når du benytter float på et element vil andre ting wrappes rundt dette elementet. Fjern float, og bruk posisjonering isteden.

pgdx · 12. november 2003

Når du benytter float på et element vil andre ting wrappes rundt dette elementet. Fjern float, og bruk posisjonering isteden.

Har prøvd diverse løsninger, men de fleste funker dårlig. For eksempel gjorde absolute position på #right slik at alle linkene i #left ikke fungerte...

Noe mer konkret om hva jeg kan bruke?

dms · 12. november 2003

Here you go, med teskje:

#left {
margin-top:20px;
margin-left:20px;
float:left;
display:block;
border:1px solid black
}
#right {
display:block;
float:left;
margin-top:20px;
margin-left:30px;
border:1px solid black
}

og

<BODY>
<div id="left"></div>
<div id="right"></div>
</BODY>

Fix ting som du vil, men det sentrale er display:block og float:left

pgdx · 13. november 2003

Når du benytter float på et element vil andre ting wrappes rundt dette elementet. Fjern float, og bruk posisjonering isteden.
Here you go, med teskje:
#left {
float:left;
Fix ting som du vil, men det sentrale er display:block og float:left

And why this sudden change of heart?

Jeg tror jeg kan gå for absolute postition, også. Fant en løsning i går som kan løse link-problemene mine, ved å bruke z-index.

dms · 13. november 2003

Det skal egentlig ikke oppstå noen linkproblemer, skjønner ikke helt hva du mener.

Sånn som jeg gjorde det til slutt vil blokken med linker utvide seg i forhold til innholdet, og hovedblokken vil følge etter. Med fast posisjonering mister man den muligheten, noe som gjør at lange linker i menyen vil splittes over flere linjer.

pgdx · 14. november 2003

Det skal egentlig ikke oppstå noen linkproblemer, skjønner ikke helt hva du mener.

Det skal ikke det, men det kan likevel gjøre det. Bare spør DiMiles... :

Men vi fikset det ved å sette z-indexen høyere på siden linkene ikke fungerte på.

Logg inn

Store CSS-problemer

Anbefalte innlegg

pgdx

Lenke til kommentar

Videoannonse

pgdx

Lenke til kommentar

dms

Lenke til kommentar

pgdx

Lenke til kommentar

dms

Lenke til kommentar

pgdx

Lenke til kommentar

dms

Lenke til kommentar

pgdx

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer