Søg
Avatar billede zarthax Nybegynder
22. januar 2005 - 17:28 Der er 14 kommentarer og
1 løsning

vertical-align på <div> i CSS?

http://zarthax.users.whitehat.dk/cvsite/index.htm

Som i kan se, står teksten totalt tosset :(

Hvordan ordner jeg den ??
Har prøvet med margin, men det rykker hele billedet :(

Kan det virkelig være rigtigt at jeg skal lave ét baggrundsbillede med al grafik, og derefter sætte kasser indover det, med tekst ????

Håber jeg ikke :(

//zarthax//
Avatar billede olebole Juniormester
22. januar 2005 - 17:38 #1
<ole>

1. Hvis du vil bruge CSS - og dine brugere vil bruge IE - er du nødt til at skrive en fuld DTD:
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
- uden URL'en i DTD'en kan IE ikke tolke CSS korrekt.

2. Vertical align berører kun indholdet i en tabelcelle. På alle andre elementer, er det selve elementet, der align'es i forhold til det øvrige indhold i det omkransende element.

/mvh
</bole>
Avatar billede zarthax Nybegynder
22. januar 2005 - 17:44 #2
hmm, ok, der blev jeg dét klogere, har da også tilført URL'en nu.. ikke at det hjalp på lige dét problem ;-)

ved godt at vertical-align hører til tables, søger noget lign. til css, netop for at undgå mit nuværende problem...

//zarthax//
Avatar billede olebole Juniormester
22. januar 2005 - 17:48 #3
Så skal du søge længe ... det findes ikke  :)
Avatar billede zarthax Nybegynder
22. januar 2005 - 17:49 #4
pokker osse..... vil det sige at jeg skal ty til løsning #2 ???
Avatar billede olebole Juniormester
22. januar 2005 - 17:49 #5
PS: vertical-align hører ikke til tables - men til alle elementer. Den opfører sig bare meget specielt i tabel-celler  :)
Avatar billede olebole Juniormester
22. januar 2005 - 17:52 #6
Du kan lægge et div i div'et med klassen 'screen'. På det div kan du sætte padding/margin uden at flytte baggrundsbilledet
Avatar billede zarthax Nybegynder
22. januar 2005 - 19:56 #7
http://zarthax.users.whitehat.dk/cvsite/index.htm
he he :)

Olé Ole :) Det virker sgu :)
Temmelig u-overskueligt, rent kodemæssigt, men det virker :)

Er dette en IE løsning alene, eller rækker den ud over det ??

//zarthax//
Avatar billede zarthax Nybegynder
22. januar 2005 - 20:16 #8
Desuden er du berettiget til point ;-)
Kræver ikke andet end at du lægger et svar :)

//zarthax//
Avatar billede olebole Juniormester
22. januar 2005 - 20:34 #9
Lige en lille fidus, der gør tingene langt mere overskueligt - og mere i overensstemmelse med 'ånden' i CSS  :)

.screen {
    background-image: url("gfx/screen.gif");
    background-repeat: no-repeat;
    width: 179px;
    height: 208px;
    z-index: 2;
}
.screen div {
    width: 159px;
    height: 188px;
    margin:    10px 10px 10px 10px;
}
.screen span {
    text-align: center;
    text-decoration: underline;
}

<div id="skerm" class="screen">
    <div><span>Velkommen.</span><br>Med dette site, vil jeg forsøge at promovere mig selv, ved at skrive en hel masse vås, der muligvis ikke engang passer. Formålet er blot at teste, om dette vindue, hvori teksten står, holder til det jeg forventer.</div>
</div>
Avatar billede olebole Juniormester
22. januar 2005 - 20:35 #10
... så har både browseren og koderen meget lettere ved at se, hvordan tingene hænger sammen  ;o)
Avatar billede zarthax Nybegynder
22. januar 2005 - 20:51 #11
Jammen dog... Var ikke klar over at man kunne fortælle CSS hvilke steder man vil have den til at lave noget, selvom der er mellemrum i "navnet"...

Mon ikke du skulle lave en "avanceret" css artikel del 1, 2, 3 ... hæhæ :)

Takker mange gange for hjælpen ole :)

//zarthax//
Avatar billede olebole Juniormester
22. januar 2005 - 21:01 #12
Selvtak. Du kan også skrive:

.klasseA {
  color: green;
}
.klasseA.klasseB {
  color: red;
}
<div class="klasseA">Grøn tekst<div class="klasseB">Rød tekst</div></div>

- eller:

.klasseA {
    font-family: verdana, sans-serif;
    color: green;
}
.klasseB {
    color: red;
}

<div class="klasseA">En tekst</div>
<div class="klasseB">En tekst</div>
<div class="klasseA klasseB">En tekst</div>

Der er rigtig mange muligheder med CSS - men nedarvning af egenskaber gennem klasser er hele grundtanken  ;o)
Avatar billede zarthax Nybegynder
22. januar 2005 - 21:06 #13
I det sidste eksempel:
Skal det forstås således, at <div class="klasseA klasseB">En tekst</div>, først får tildelt "klasseA", og derefter "klasseB", hvor klasseB blot ændrer farven og beholder den af klasseA tildelte tekst ??
Avatar billede olebole Juniormester
22. januar 2005 - 21:17 #14
Yups ... den sidste overskriver properties i den første klasse. Hvis du f.eks. har en masse divs, der skal være ens - men tre af dem skal have en anden bredde og tekstfarve  :)
Avatar billede zarthax Nybegynder
22. januar 2005 - 21:20 #15
Genialt... sparer tid, når man altså mestrer det ;-P

Hvor lærer jeg mere om det henne ???
(din hjælp hjalp: http://zarthax.users.whitehat.dk/cvsite/index.htm )

//zarthax//
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 22:58 Kan man undgå at få vist referer når der klikkes på links Af Strawberry i Browsere
I går 12:21 Er det svindel eller fra Microsoft Af mort1 i Andet sikkerhed
15/0811:56 Er det muligt at lave sin egen webserver i boligforening? Af Strawberry i Cloudtjenester
14/0810:21 Ny printer, men hvilken Af mort1 i Printere
13/0819:41 USB på Linux Af Uvanga i Linux
White papers
Flere white papers »