Notifikationer

Markér alle som læst Log ud

lsskaarup Nybegynder

07. november 2004 - 22:25 Der er 7 kommentarer og
1 løsning

Div med fast bredde og tekstombrydning

Jeg skal have kombineret en fast bredde og tekstombrydning i et Div-tag, men kan ikke få dem begge til at virke på samme tid.

Kan det gøres og hvordan?

Min kode se indtil videre sådan ud:
<div>
<div style="solid black;float:right"><img src="<?=$nyhed[sti]?>"></div>
<div><font class="STRONG"><?=$nyhed[overskrift]?></font><br><font class="SMALL">skrevet d. <?=$nyhed[dato]?></font></div>
<div style="width: 500;"><?=$nyhedstekst?></div>
</div>

Mit problem er at hvis jeg ikke har den faste bredde på de "nyheder" som ikke er store nok til at fylde bredden ud, så kommer layouttet til at se meget dårligt ud, omvendt når jeg har sat en fast bredde på, så bliver teksten justeret så den står en linie under billedet (sti) og ikke på linie med toppen af dette.

Giver det nogen mening?

Synes godt om

lsskaarup Nybegynder

07. november 2004 - 22:42 #1

Jeg har lavet en ander løsning hvor den første div får en på style="width:498", men jeg synes ikke det er en så fantastisk løsning, så kom endelig med dem hvis der er andre og bedre løsninger.

Synes godt om

Slettet bruger

08. november 2004 - 00:16 #2

Jeg ved ikke lige, om det løser dit problem (eller måske bare giver inspiration til en løsning), men prøv med noget i denne stil (Jeg gik ud fra, at du havde en <h1> som sidetitel):

<div class='nyhed'>
<img src="<?=$nyhed[sti]?>"></div>
<h2><?=$nyhed[overskrift]?></h2><h3>skrevet d. <?=$nyhed[dato]?></h3>
<p><?=$nyhedstekst?></p>
</div>

I CSS skal du så have:

#nyhed {
width:498;
}

#nyhed img {
float:right;
}

#nyhed h2 {
/* stil til overskrift */
}

#nyhed h3 {
/* stil til dato */
}

#nyhed p {
/* stil til selve teksten */
}

Hvis du vil have selve teksten ned under billedet, skal du bruge clear:both; (eller bare clear:right;) i #nyhed p. Ellers kan du bruge clear:none; på alt andet end billedet.

Synes godt om

Slettet bruger

08. november 2004 - 00:17 #3

Hov. Jeg havde glemt at fjerne </div> på linie 2.

Synes godt om

lsskaarup Nybegynder

08. november 2004 - 10:03 #4

Naaa, selvfølgelig skal jeg bruge noget stylesheet, men om det ligge i css, eller på koden er i fedt lige nu. Det var også mere have der skulle stå for at få både en fast bredde, og tekstombrydningen.

Du kn prøve at se på http://www.larsskaarup.dk/randerssport/nyheder.php, hvor min seneste løsning er. Her har jeg altså være inde og sætte en fast bredde, som passe tl layouttet, for at få både tekstombrydning på de nyheder, hvor indholdet er langt nok til det, samt for at holde layouttet, så de "små" nyheder ikke bliver forrykket i forhold til de "store".

Det jeg så gerne vil have er en anden løsning, end den jeg bruger hvor altså siger <div style="width:498"...>, hvis der altså er en anden løsning. Jeg skal have både i pose og sæk, i dette tilfælde ;-)

Synes godt om

Slettet bruger

08. november 2004 - 20:03 #5

OK, nu tror jeg, jeg ved hvad du mener. Den næste nyheds billede kravler længere ind, og det er grimt, så det vil du gerne slippe for.

Hvis du tager min løsning, skal du bare tilføje clear:both; til stilen for den div, der omslutter en nyhed.

#nyhed {
clear:both;
}

Og bredden er nok ikke nødvendig.

Synes godt om

lsskaarup Nybegynder

09. november 2004 - 17:00 #6

Yes, sådan nu virker det.

Jeg måtte bare ligge det på den aller første div, men hvad er det egentlig man beder om at bede udført?

Synes godt om

Slettet bruger

09. november 2004 - 22:27 #7

Fidusen er, at normalt, når man bruger en float, så ønsker man at flere efterfølgende blokke skal rykke indenfor den. Det er for eksempel tilfældet, hvis man laver et billede efterfulgt af flere tekstafsnit, hvor det første er kort. Der ønsker man almindeligvis ikke at andet tekstafsnit skal rykkes ned under billedet, og det er derfor den situation browserne ud fra, hvis de ikke får andet at vide.

Med clear-indstillingen kan man fortælle, at det pågældende element først skal starte nedenunder et eventuelt floatet element. Den kan sættes til left, right, both eller none. None er normalindstillingen og de andre styrer hvilken side, der skal være tom for floats, før nuværende element starter.

Synes godt om

lsskaarup Nybegynder

09. november 2004 - 23:01 #8

okay, tak for hjælpen.

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

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.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS