Avatar billede mygster Nybegynder
15. september 2006 - 08:23 Der er 12 kommentarer og
1 løsning

Design falder fra hinanden

Hej jeg har et problem med at mit design bliver rykket fra hinanden ligeså snart der kommer indhold på siden, som fylder mere end to liner.

html kode:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<link rel="stylesheet" href="textstyle.css" type="text/css">
</HEAD>


<BODY>
<div style="width:750px;">
<!-- VENSTRE SIDE START -->

<div style="float:left;width:120px;height:700px;background-color:#CCCCCC;height:700px; background-image: url(images/left_back.gif);border-style:solid;border-width:0px 1px 0px 0px;border-color:#EEFDCF;">
    </div>

<!-- VENSTRE SIDE SLUT -->


<!-- HØJRE SIDE START -->
<div style="float:right;">
<div style="width:629px; height:60px;background-color:#509334;">

<script type="text/javascript"><!--
google_ad_client = "pub-0323025933921922";
google_ad_width = 468;
google_ad_height = 60;
google_ad_format = "468x60_as";
google_ad_type = "text_image";
google_ad_channel ="";
google_color_border = "305D15";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_text = "000000";
google_color_url = "008000";
//--></script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>


<!-- MENU - TOP -->
<div style="border-style:solid;border-width:0px 0px 1px 0px;border-color:#FFFFFF;">

<div style="background-image: url(images/back_menu.gif);background-color:#EEFDCF;padding:20px 2px 0px 36px; width:629px;border-style:solid;border-width:0px 0px 3px 0px;border-color:#38621E;">
<div class="knap"><a href="#"><font color="#224F0B">Forside</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Hesteracer</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Rideudstyr</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Dressur</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Forum</font></a></div>
          </div>
</div>

<!-- INDHOLD START-->

<center>
<div style="background-color:#E8FDCE;">
<div style="width:580px;height:700px;margin-top:0px;background-image: url('images/bg.gif');background-repeat: repeat-y;border-style:solid;border-width:0px 0px 0px 0px;border-color:#38621E; E">

hvor rykker mit design fra hinanden når der kommer meget tekst i indholdsfeltet. aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

</center>
</div>

</div>


<!-- INDHOLD SLUT-->



<!-- HØJRE SIDE SLUT -->


</div>
</BODY>
</HTML>
Avatar billede jokkejensen Novice
15. september 2006 - 09:13 #1
det er fordi din browser ikke kant tekstombryde det lange ord "aaaaa..." det er jo også et unormalt langt ord, det får du aldrig brug for !!!

Et fix kan være - at tilføje overflow:hidden; det fjerner de resterende a'r men det er vel ikke aktuelt med de lange ord ?

/JJ
Avatar billede mygster Nybegynder
15. september 2006 - 10:42 #2
nej det var mere ment som et eksempel. Det jeg mangler er at indholdet i mit <div>-tag bare skal skifte linie automatisk. så jeg bare kan skrive løs uden at bekymrer mig om liniens længde.
Avatar billede jokkejensen Novice
15. september 2006 - 10:51 #3
Den sørger også selv for at lave linie skift !! hvis det er muligt altså ..

en browser kan ikke dele aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

et fornuftigt sted..

se her :


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<link rel="stylesheet" href="textstyle.css" type="text/css">
</HEAD>


<BODY>
<div style="width:750px;">
<!-- VENSTRE SIDE START -->

<div style="float:left;width:120px;height:700px;background-color:#CCCCCC;height:700px; background-image: url(images/left_back.gif);border-style:solid;border-width:0px 1px 0px 0px;border-color:#EEFDCF;">
    </div>

<!-- VENSTRE SIDE SLUT -->


<!-- HØJRE SIDE START -->
<div style="float:right;">
<div style="width:629px; height:60px;background-color:#509334;">

<script type="text/javascript"><!--
google_ad_client = "pub-0323025933921922";
google_ad_width = 468;
google_ad_height = 60;
google_ad_format = "468x60_as";
google_ad_type = "text_image";
google_ad_channel ="";
google_color_border = "305D15";
google_color_bg = "FFFFFF";
google_color_link = "0000FF";
google_color_text = "000000";
google_color_url = "008000";
//--></script>
<script type="text/javascript"
  src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>


<!-- MENU - TOP -->
<div style="border-style:solid;border-width:0px 0px 1px 0px;border-color:#FFFFFF;">

<div style="background-image: url(images/back_menu.gif);background-color:#EEFDCF;padding:20px 2px 0px 36px; width:629px;border-style:solid;border-width:0px 0px 3px 0px;border-color:#38621E;">
<div class="knap"><a href="#"><font color="#224F0B">Forside</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Hesteracer</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Rideudstyr</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Dressur</font></a></div>
<div class="knap"><a href="#"><font color="#224F0B">Forum</font></a></div>
          </div>
</div>

<!-- INDHOLD START-->

<center>
<div style="background-color:#E8FDCE;">
<div style="width:580px;height:700px;margin-top:0px;background-image: url('images/bg.gif');background-repeat: repeat-y;border-style:solid;border-width:0px 0px 0px 0px;border-color:#38621E; E">

<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam rhoncus ante a urna. Pellentesque lorem. Ut cursus. Vestibulum aliquam aliquam metus. Donec varius. Maecenas nec mi. Pellentesque ante purus, placerat a, rhoncus sed, condimentum in, metus. Maecenas turpis. Nullam quis nisi. In vitae diam. Fusce eget nisl.
</p>
<p>
Praesent varius, urna a sodales suscipit, purus eros feugiat eros, id viverra lacus purus a nulla. Pellentesque venenatis massa et magna. Maecenas tincidunt ligula ac lacus. Phasellus tortor lorem, laoreet eget, eleifend at, nonummy quis, risus. Curabitur vestibulum enim sit amet augue. Donec luctus augue sed orci. Nullam purus. Aenean pretium lacus quis elit. Nullam sagittis laoreet massa. Duis lacinia arcu vulputate massa. Phasellus auctor lectus vel odio. Mauris mattis elementum elit. Etiam justo eros, luctus sed, dignissim vitae, iaculis et, arcu. Curabitur sed mi nec turpis faucibus sagittis. Maecenas placerat est eu lorem. Duis lorem urna, aliquet vitae, bibendum ac, suscipit vitae, lectus. Proin aliquam venenatis nisl. In hac habitasse platea dictumst. Quisque aliquam ultrices dolor. Proin cursus justo at justo.
</p>
Quisque varius commodo ante. Donec sit amet enim. Proin non orci. Phasellus auctor. Etiam vehicula consectetuer arcu. Sed scelerisque ligula vel risus. Curabitur quis dui. Fusce massa. Donec egestas euismod dui. Nunc eget lorem. Mauris pede. Ut rhoncus bibendum nibh. Sed aliquam quam non lacus. Donec sagittis tempor turpis. Nunc bibendum dui nec lorem. Nulla euismod elit a mauris. Aliquam sem. Morbi vestibulum. In nec enim eu metus venenatis posuere. Nullam a enim vitae odio dictum hendrerit.
<p>
Phasellus vitae erat. Nulla posuere lectus a velit. Nunc viverra viverra tellus. Donec vel arcu. Pellentesque vestibulum turpis quis sem. Integer magna nulla, iaculis sit amet, dictum nec, ultricies vel, lectus. Fusce augue eros, dapibus tempus, commodo non, interdum porttitor, enim. Duis eleifend magna eu lectus. Aliquam rhoncus. Vestibulum placerat, sem ut suscipit aliquet, nibh ante posuere augue, et malesuada diam tortor vel ipsum. Suspendisse porttitor, neque non laoreet porta, tortor elit sagittis lorem, et euismod ipsum ipsum quis velit. Aliquam sollicitudin augue vel dui.
</p>
<p>
Fusce iaculis tincidunt odio. Vivamus egestas, magna scelerisque placerat ultrices, nisl elit commodo mi, ut posuere lorem enim vitae erat. Phasellus aliquet lacus at velit. Nam egestas urna eget elit. Nulla cursus purus sed nisl. Sed sodales sodales urna. Donec diam urna, ullamcorper eu, facilisis nec, rhoncus vitae, enim. Pellentesque vel urna. Quisque aliquam orci quis velit. Phasellus consectetuer fermentum est. Suspendisse condimentum. Sed tincidunt lorem eu risus. Praesent leo felis, hendrerit non, semper vel, viverra ut, lacus. Suspendisse tristique eros vitae pede. Quisque scelerisque. Phasellus ultricies, erat sit amet commodo euismod, velit urna tincidunt enim, nec varius ligula sapien mattis libero.
</p>

</center>
</div>

</div>


<!-- INDHOLD SLUT-->



<!-- HØJRE SIDE SLUT -->


</div>
</BODY>
</HTML>
Avatar billede mygster Nybegynder
15. september 2006 - 11:01 #4
tak det virker! Hvordan giver jeg dig dine point.. (ny her):-)
Avatar billede mclemens Nybegynder
15. september 2006 - 11:07 #5
((( [ en browser kan ikke dele aaa ... aaa et fornuftigt sted.. ]
IE kan dele den ...

<div style="word-wrap:break-word;width:100px;">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa-aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>

)))

[ tak det virker! Hvordan giver jeg dig dine point.. (ny her):-) ]
Jokke kaster et svar, du markerer hans navn i boksen der dukker frem og trykker accepter
Avatar billede mygster Nybegynder
15. september 2006 - 11:15 #6
hvilken boks ? sry !
Avatar billede jokkejensen Novice
15. september 2006 - 11:15 #7
hæp..

Men virker word-wrap i ie, så den automatisk cutter lange strenge op, strenge der normalt ikke kan deles ?

/J
Avatar billede mclemens Nybegynder
15. september 2006 - 11:16 #8
Den kommer når han har lagt et svar.
1. Jokke kaster et svar,
2. du markerer hans navn i boksen der dukker frem
3. og trykker accepter
Avatar billede jokkejensen Novice
15. september 2006 - 11:16 #9
svar
Avatar billede mclemens Nybegynder
15. september 2006 - 11:16 #10
[ Men virker word-wrap i ie, så den automatisk cutter lange strenge op, strenge der normalt ikke kan deles ? ] Jep, prøv 11:07:43 :o)
Avatar billede jokkejensen Novice
15. september 2006 - 11:16 #11
mygster >> jeg gjorde ikke noget ved dit kode..

jeg undlod bare at skrive et ord, uden mellemrum !!! den kan ikke dele aaaaaaaaaaaaaa op.. men aaaa a aaaaa aaaa aaaaa ville gå..

/JJ
Avatar billede jokkejensen Novice
15. september 2006 - 11:17 #12
snedigt :)
Avatar billede mygster Nybegynder
15. september 2006 - 11:23 #13
nå ok, jeg var bare kørt lidt sukkerkold i det, så den opdagede jeg ikke :P
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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