Autor | Zpráva | ||
---|---|---|---|
lukasfigo Profil |
#1 · Zasláno: 22. 3. 2013, 16:29:14
Dobrý den, mám problém s divy. Potrebuju dosahnout pomoci divu nasledujiciho vysledku:
[img][/img] Ale text mi "vyleza" z jednotlivych divu...Nedari se mi to udelat tak aby se tak nedelo, nevite nekdo jak to udelat? prikladam Zdrojak: <body> <form id="form1" runat="server"> <div id="wrap"> <div class="top_corner"> </div> <div id="main_container"> <div id="header"> <div id="logo"> TADY BUDE LOGO </div> <div id="menu"> Tude MENUTadyMENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTadyMENady bude MENUTady bude MENUTady bude MENUTady bude MENUTady bude MENU </div> </div> <div class="middle_banner"> <div class="featured_slider"> <!-- začátek slide banneru --> <div id="featured_border" class="jcarousel-container"> <div id="featured_wrapper" class="jcarousel-clip"> <ul id="featured_images" class="jcarousel-list"> <li><img src="images/slider_photo.jpg" alt="" height="280" width="965" /></li> <li><img src="images/slider_photo2.jpg" alt="" height="280" width="965" /></li> <li><img src="images/slider_photo3.jpg" alt="" height="280" width="965" /></li> <li><img src="images/slider_photo2.jpg" alt="" height="280" width="965" /></li> </ul> </div> <div id="featured_positioner_desc" class="jcarousel-container"> <div id="featured_wrapper_desc" class="jcarousel-clip"> <ul id="featured_desc" class="jcarousel-list"> </ul> </div> </div> <ul id="featured_buttons" class="clear_fix"> <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> </div> <!-- konec slide banneru --> </div> </div> </div> </div> <!---------------------------------konec banneru--------------------------------> <div id="wrap2"> <div class="spodek_mezera"> </div> <div id="main_container2"> <div id="spodni_cast"> <div id="leve_menu"> PrihlaseniA </div> <div id="obsah_stred"> Tady bude MENUTady bude MENUTa bude MENUTady bude MENUTa bude MENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTadyMENUTady bude MENUTa bude MENUTady bude MENUTa bude MENUTady bude MENUTady bude MENUTady bude MENUTady bude MENUTady bude MENUTady bude MENUTady bude MENUTady bude MENUTady bude MENU <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server"> <!--OBSAH--> </asp:ContentPlaceHolder> </div> </div> </div> <!---------------------------------Patička--------------------------------> <div class="footer"> <div class="copyright"> </div> <div class="footer_links"> </div> </div> </div> </form> </body> a CSS: body { background:url(images/bg.gif) repeat; margin:0px; padding:0px; font-size:12px; font-family:Arial, Helvetica, sans-serif; color:#000; } p{ text-align:justify; line-height:19px; padding:0px; margin:0px; } h2{ padding:0px 0 10px 0; margin:0px; color:#B52025; font-size:20px; font-weight:normal; } #wrap{ width:977px; margin:auto auto auto auto; } .top_corner{ width:976px; height:15px; background:url(images/top_bg.gif) no-repeat center bottom; } #main_container{ width:977px; background:url(images/center_bg_repeat.gif) repeat-y center; } #header{ width:960px; margin:auto; height:90px; } #logo{ padding:10px 0 0 20px; float:left; } /*----------------------menu-------------------------*/ #menu{ width:530px; float:right; padding:40px 0 0 0; } /*-----------------middle_banner----------------------------*/ .middle_banner{ width:977px; height:304px; background:url(images/middle_banner_bg.gif) no-repeat center; } /*----------------------slider---------------------------*/ .featured_slider { width:965px; margin:auto; float:left; margin:18px 0 0 6px; } ul, li{ padding:0px; margin:0px; list-style:none; } /** ----------------------------------------------------- **/ #featured_border { position: relative; border: none; padding:0px; height:280px; margin: 0px; } #featured_wrapper { position: relative; width: 100%; height: 100%; overflow: hidden; } #featured_images { position: absolute; left: 0; top: 0; } #featured_images li { float: left; } #featured_positioner_desc { width:965px; height: 280px; position: absolute; top: 0px; left: 0px; } #featured_wrapper_desc { width: 100%; height:280px; position: relative; overflow: hidden; } #featured_desc { position: absolute; left: 0; bottom: 0; padding:0px; margin:0px; } #featured_desc li { width: 965px; float: left;padding:0px; margin:0px; } #featured_desc li div { margin:0px 0 0px 0px; padding:10px; width:945px; background: url(images/featured-desc-bg.png); } #featured_desc li h2 { color:#FFFFFF; font-size:18px; padding:0px 0 5px 0; margin:0px; } #featured_desc li p { color: #FFFFFF; font-size: 12px; padding: 0px 0 10px 0; margin: 0px; line-height: 18px; } #featured_buttons { position: absolute; top: 15px; right: 15px; width: auto; padding:0; list-style:none;} #featured_buttons li { width: 22px; height: 22px; background: url(images/featured-button-off.png); float: left; margin-left: 3px; text-align:center; font-size:12px; color:#FFFFFF; line-height:22px; cursor: pointer; } #featured_buttons li.clicked { background: url(images/featured-button-on.png); } /**/ /*-------------------------------*/ #wrap2{ width:977px; margin:auto auto auto auto; } .spodek_mezera{ width:976px; height:15px; background:url(images/top_bg.gif) no-repeat center bottom; } #main_container2{ width:977px; background:url(images/center_bg_repeat.gif) repeat-y center; } #header2{ width:960px; margin:auto; height:auto; } #leve_menu{ padding:10px 0 5px 5px; float:left; width:250px; height:auto; } #obsah_stred{ width:690px; height:auto; float:right; padding:10px 5px 5px 5px; } /*---------------footer------------------*/ .footer{ clear:both; width:960px; margin:auto; background:url(images/footer_bg.jpg) no-repeat center; height:65px; } .copyright{ float:left; padding:30px 0 0 15px; color:#6996c0; } .copyright a{ color: #2A1C11; text-decoration:none; } .footer_links{ float:right; padding:30px 15px 0 0; } .footer_links a{ text-decoration:none; color: #2A1C11; padding-left:10px; } .footer_links a:hover{ text-decoration:underline; color: #2A1C11; } |
||
Davex Profil |
#2 · Zasláno: 22. 3. 2013, 19:31:01
Nevidím výsledek a ani nic vylézat. Prosím o odkaz na živou ukázku.
|
||
lukasfigo Profil |
#3 · Zasláno: 23. 3. 2013, 09:25:32 · Upravil/a: lukasfigo
|
||
Plaváček Profil |
#4 · Zasláno: 23. 3. 2013, 09:29:58
lukasfigo:
Z obrázku se toho moc poznat nedá. Ale jedná dobrá rada by se našla. Zkus používat mezi slovy mezery. Je to běžné v češtině i jiných jazycích. Problém pravděpodobně zmizí sám od sebe. |
||
lukasfigo Profil |
#5 · Zasláno: 23. 3. 2013, 10:08:50
Plaváček:
Nahoře jsou i mé zdrojové kódy atd...Mezery nepomáhají, stále text roztažený mimo div... |
||
Plaváček Profil |
#6 · Zasláno: 23. 3. 2013, 10:09:57
lukasfigo:
Bez živé ukázky (viz výše) ti nikdo nepomůže. |
||
lukasfigo Profil |
#7 · Zasláno: 23. 3. 2013, 10:27:59
Plaváček:
Co je myšleno živou ukázkou? Nahoře jsem dal můj zdroják a CSS, co je ještě potřeba? |
||
Plaváček Profil |
#8 · Zasláno: 23. 3. 2013, 10:29:30
lukasfigo:
Tak ještě jednou: Povídání o živých ukázkách |
||
lukasfigo Profil |
#9 · Zasláno: 23. 3. 2013, 10:35:42
Dokázal by mi prosím někdo poradit i bez toho abych to musel někde zveřejnovat? Myslím si že překopčit si zdroják není nic tak složitého, a byl bych rád kdyby to někdo zkusil a poradil...
|
||
margin Profil * |
#10 · Zasláno: 23. 3. 2013, 11:16:05
|
||
lukasfigo Profil |
#11 · Zasláno: 23. 3. 2013, 11:26:51 · Upravil/a: lukasfigo
Když to debugnu ve visual studiu, a pustim tak se to roztáhne přes celou plochu, viz, předchozí obrázek...
takle vypadá jestě moje hlavička, ale tam taky nevidím problém: <head runat="server"> <title>TJ TUPESY</title> <asp:ContentPlaceHolder id="head" runat="server"> </asp:ContentPlaceHolder> <meta http-equiv="Content-Type"content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="style.css" media="screen" /> <script type="text/javascript" src="js/jquery.core.js"></script> <script type="text/javascript" src="js/jquery.superfish.js"></script> <script type="text/javascript" src="js/jquery.jcarousel.pack.js"></script> <script type="text/javascript" src="js/jquery.easing.js"></script> <script type="text/javascript" src="js/jquery.scripts.js"></script> </head> |
||
lukasfigo Profil |
#12 · Zasláno: 23. 3. 2013, 18:56:32
Tak další zjištění: v exploreru OK, v mozille leze text mimo...:/
|
||
margin Profil * |
#13 · Zasláno: 23. 3. 2013, 19:40:00
Nevidím nic vyčuhovat, ani ve Firefoxu, ani v jiných prohlížečích.
http://browsershots.org/http://fiddle.jshell.net/9P6mZ/show/ Bez živé ukázky ti nikdo nedokáže poradit. |
||
Plaváček Profil |
lukasfigo:
Tak ještě jednou a z mé strany naposledy. Žádáš radu zdarma, takže to nejmenší, co bys měl udělat, je dodat odkaz na živou ukázku. Nikdo ze zdejších borců nebude ztrácet čas vrtáním se ve fragmentech kódu, které s tvým problémem vůbec nemusí souviset. |
||
peta Profil |
#15 · Zasláno: 26. 3. 2013, 08:18:14
http://2i.cz/9bad3e14c7
Pokud text takto preteka, mas chybne nastavenou width a position. Je mozne, ze ti obrazek width roztahne nebo z jineho duvodu. Pokud das text bez mezer a div nema nastavenou width, tak se automaticky roztahuje do sirky. Pokud width ma, tak vytece text mimo div. To se da overit tak, ze das na konec css pro vsechny divy ramecek. div {border:1px solid #f00;} Ja treba prvni, co delam, tak celou stranku obalim divem class=site a nastavim mu sirku. Do nej pak davam ostatni tagy, ktere mi pak nevytecou, obvykle. Pokud jo, je problem s jejich chybnou sirkou a bud u div.site sirku zvetsim nebo to prestavim jinak. Margin vzal tvuj kod a nic mu tam necouha. Takze v tom kousku neni chyba, asi. Nebo ji zpusobuji neco, co jsi neukazal. Jinak, ve tvem poslednim kousku kodu je jakysi neexistujici tag ASP. Bylo by fajn, kdyz uz davas html kod, vytahnout ho primo z prohlizece (FF - ctrl+u / nastroje - vyvoj webu - zdrojovy kod), kde je skutecny html, ktery prohlizec pouziva s ne kod pro prekladac z asp. |
||
Časová prodleva: 11 let
|
0