Не получается нормально растянуть страницу...

сайт - http://www.school4-minsk.tu2.ru/
саму страницу растянул в xtml'е, а модули, которые по середине, не получается..(( что надо править?
вот CSS:

Код (CODE):

1. /* general stuff */
2.  
3.  
4. body{
5. margin:0;
6. padding:0;
7. text-align: center;
8. font-family: verdana, arial, sans-serif;
9. }
10.  
11. a {
12. text-decoration:  none;
13. font-weight: bold;
14. border: none;
15.  }
16. a:hover {
17. text-decoration:  underline;
18. border: none;
19.  }
20.  
21. /* Layout */
22.  
23. #accessibility {
24. position: absolute;
25. left: -2000px;
26. top: -2000px;
27. display: none;
28. }
29.  
30. #source {
31. position: absolute;
32. left: -2000px;
33. top: -2000px;
34. display: none;
35. }
36.  
37. #pagewidth-800{
38. width:770px;
39. text-align:left;
40. margin-left:auto;
41. margin-right:auto;
42. background: transparent url(../images/back_all.gif) repeat-y 0px 140px;
43. margin-bottom: 20px;
44. }
45.  
46. #pagewidth-1024{
47. width:970px;
48. text-align:left;
49. margin-left:auto;
50. margin-right:auto;
51. background: transparent url(../images/back_all1024.gif) repeat-y ;
52. margin-bottom: 20px;
53. }
54.  
55. #header {
56. height:  116px;
57. width:  100%;
58.  }
59.  
60. #top-top {
61. height: 30px;
62. width: 100%;
63. background: transparent;
64. }
65.  
66. #top-bottom {
67. height: 80px;
68. width: 200px;
69. background: transparent;
70. float: left;
71. }
72.  
73. #search {
74. margin: 0px;
75. padding: 0px;
76. width: 148px;
77. height: 28px;
78. float: right;
79. background: url(../images/back_search.jpg) right top no-repeat;
80. padding-left: 10px;
81. padding-top: 2px;
82. vertical-align: top;
83. }
84.  
85. #search .inputbox{
86. width: 100px;
87. height: 18px;
88. font-size: 10px;
89. background: transparent;
90. border: none;
91. margin: 0px;
92. padding: 0px;
93. line-height: 14px;
94. }
95.  
96. #search .button{
97. margin: 0px;
98. padding: 0px;
99. height: 14px;
100. font-size: 10px;
101. background: transparent;
102. border: none;
103. line-height: 10px;
104. }
105.  
106. #search form {
107. margin: 0px;
108. padding: 0px;
109. }
110.  
111. #topmenu{
112. height: 20px;
113. float: right;
114. width: 600px;
115. }
116.  
117.  
118. #pathway{
119. width: 500px;
120. height: 19px;
121. padding-left: 20px;
122. padding-top: 5px;
123. }
124.  
125. #leftcol{
126.  width: 152px;
127.  float: left;
128.  position: relative;
129.  margin-right: 5px;
130.  }
131.  
132. #rightcol-normal{
133.  width: 155px;
134.  float: right;
135.  position: relative;
136.  margin-right: 1px;
137.  margin-top: -22px;
138.  }
139.  
140. #rightcol-broad{
141.  width: 180px;
142.  float: right;
143.  position: relative;
144.  margin-right: 1px;
145.  margin-top: -22px;
146.  }
147.  
148. #outer-800{
149. width: 770px;
150. padding-top: 6px;
151. }
152.  
153. #outer-1024{
154. width: 970px;
155. padding-top: 6px;
156. }
157.  
158. #footer-800{  
159. height: 40px;
160. width:100%;
161. background: transparent url(../images/footer.jpg) bottom left no-repeat;
162. font-size: 10px;
163. }
164.  
165. #footer-1024{  
166. height: 40px;
167. width: 100%;
168. background: transparent url(../images/footer1024.jpg) bottom left no-repeat;
169. font-size: 10px;
170. }
171.  
172. #maincol-normal-800{
173.  float: left;
174.  width: 600px !important;
175.  margin-left: 0px !important;
176.  margin-left: -5px;
177.  width: 600px;
178.  }
179.  
180. #maincol-broad-800{
181.  float: left;
182.  width: 600px !important;
183.  margin-left: 0px !important;
184.  margin-left: -5px;
185.  width: 600px;
186.  }
187.  
188.  #maincol-wide-800{
189.  float: left;
190.  width: 600px !important;
191.  width: 595px;
192.  margin-left: 0px !important;
193.  margin-left: -5px;
194.  padding-top: 3px !important;
195. padding-top: 0px;
196.  }
197.  
198.  
199. #maincol-normal-1024{
200.  float: left;
201.  width: 650px;
202.  margin-left: 0px !important;
203.  margin-left: -5px;
204.  }
205.  
206. #maincol-broad-1024{
207.  float: left;
208.  width: 622px;
209.  margin-left: 0px !important;
210.  margin-left: -5px;
211.  }
212.  
213.  #maincol-wide-1024{
214. float: left;
215. width: 800px;
216. padding-top: 3px !important;
217. padding-top: 0px;
218.  margin-left: 0px !important;
219.  margin-left: -5px;
220.  }
221.  
222.  #banner {
223.  width: 478px;
224.  height: 69px;
225.  float: right;
226.  padding-left: 6px;
227.  padding-top: 6px;
228.  }
229.  
230.  iframe.wrapper {
231.  z-index: 0;
232.  }
233.  
234. .clr{clear:both;}
235. .content {
236. padding: 0px 0px 0px 0px;
237. font-size: 10px;
238. line-height: 18px;
239. }
240.  
241. /* Modules */
242.  
243. #leftcol div.module, #rightcol-normal div.module {
244. width: 152px;
245. background: transparent url(../images/module_middle.jpg) left repeat-y;
246. margin-bottom: 10px;
247. }
248.  
249. #leftcol div.module div, #rightcol-normal div.module div {
250. width: 152px;
251. background: transparent url(../images/module_top.jpg) top left no-repeat;
252. }
253.  
254. #leftcol div.module div div, #rightcol-normal div.module div div {
255. width: 152px;
256. background: transparent url(../images/module_bottom.jpg)  bottom left no-repeat;
257. }
258.  
259. #leftcol div.module div div div,#rightcol-normal div.module div div div{
260. width: 137px;
261. padding-left: 5px;
262. padding-right: 10px;
263. padding-top: 10px;
264. background: transparent;
265. padding-bottom: 10px;
266. font-size: 10px;
267. }
268.  
269. #leftcol div.module div div div div, #rightcol-normal div.module div div div div{
270. padding: 0px;
271. margin: 0px;
272. }
273.  
274. #rightcol-broad div.module {
275. width: 177px;
276. background: transparent url(../images/module_middle_wide.jpg) left repeat-y;
277. margin-bottom: 10px;
278. }
279.  
280. #rightcol-broad div.module div {
281. width: 177px;
282. background: transparent url(../images/module_top_wide.jpg) top left no-repeat;
283. }
284.  
285. #rightcol-broad div.module div div {
286. width: 177px;
287. background: transparent url(../images/module_bottom_wide.jpg)  bottom left no-repeat;
288. }
289.  
290. #rightcol-broad div.module div div div{
291. width: 162px;
292. padding-left: 5px;
293. padding-right: 10px;
294. padding-top: 10px;
295. background: transparent;
296. padding-bottom: 10px;
297. font-size: 10px;
298. }
299.  
300. #rightcol-broad div.module div div div div{
301. padding: 0px;
302. margin: 0px;
303. }
304.  
305.  
306.  
307.  
308. div.module h3 {
309. font-size: 14px;
310. width: 130px;
311. font-weight: bold;
312. margin: 0px;
313. padding: 0px;
314. margin-bottom: 5px;
315. }
316.  
317. #user1{
318. float: left;
319. width: 49%;
320. }
321.  
322. #user2{
323. float: right;
324. width: 49%;
325. }
326.  
327. #user3 {
328. width: 100%;
329. }
330.  
331. #user1 ul, #user2 ul, #user3 ul {
332. list-style: none;
333. margin: 0px;
334. padding: 0px;
335. padding-left: 0.7em;
336. margin-left: 0.7em;
337. margin-bottom: 5px;
338. margin-top: 2px;
339. }
340.  
341. #maincol-normal-800 div.moduletable, #maincol-wide-800 div.moduletable, #maincol-broad-800 div.moduletable, #maincol-normal-1024 div.moduletable, #maincol-wide-1024 div.moduletable, #maincol-broad-1024 div.moduletable {
342. width: 100%;
343. margin-bottom: 10px;
344. border: 1px solid #EFEFEF;
345. background: transparent;
346. font-size: 10px;
347. }
348.  
349. #maincol-normal-800 div.moduletable h3, #maincol-wide-800 div.moduletable h3, #maincol-broad-800 div.moduletable h3, #maincol-normal-1024 div.moduletable h3, #maincol-wide-1024 div.moduletable h3, #maincol-broad-1024 div.moduletable h3 {
350. font-size: 12px;
351. font-weight: bold;
352. margin: 0px;
353. padding: 0px;
354. height: 20px;
355. line-height: 20px;
356. color: #FFF;
357. width: 100%;
358. border-bottom: 1px solid #EFEFEF;
359. text-align: left;
360. text-indent: 5px;
361. }
362.  
363. /* Topmenu */
364.  
365.  ul#mainlevel-nav
366. {
367. list-style: none;
368. padding: 0;
369. margin: 0;
370. float: right;
371. white-space: nowrap;
372. }
373.  
374. ul#mainlevel-nav li{
375. width: auto !important;
376. width: 5%;
377. float: left;
378. margin: 0;
379. font-size: 10px;
380. height: 20px;
381. line-height: 20px;
382. white-space: nowrap;
383. margin-right: 1px; 
384. }
385.  
386. ul#mainlevel-nav li a{
387. font-weight: normal;
388. height: 20px;
389. display: block;
390. padding-left: 5px;
391. padding-right: 10px;
392. text-decoration: none;
393. color: #CCCCCC;
394. margin-left: 5px;
395. white-space: nowrap;
396. }
397.  
398.  
399.  
400. /* Main Menu(s) */
401.  
402. a.mainlevel {
403. font-size: 10px;
404. padding-left: 4px;
405. width: 143px;
406. display: block;
407. line-height: 26px;
408. margin-bottom: 2px;
409. text-decoration: none;
410. font-weight: normal;
411. border-right: 4px solid #CACACA;
412. voice-family:"\"}\""; /* Box Model fix */
413. voice-family:inherit;
414. width: 135px;
415. }
416.  
417.  
418.  
419. html>body a.mainlevel {width:135px;} /* Opera5-Fix-fix ;-) */
420.  
421.  
422. a.mainlevel:hover, a.mainlevel#active_menu {
423. background: #F1F1F1;
424. text-decoration: none;
425. }
426.  
427. a.sublevel {
428. padding: 0px;
429. margin: 0px;
430. font-size: 10px;
431. padding-left: 12px;
432. width: 139px;
433. display: block;
434. line-height: 20px;
435. margin-bottom: 2px;
436. text-decoration: none;
437. font-weight: normal;
438. border-right: 4px solid #CACACA;
439. voice-family:"\"}\""; /* Box Model fix */
440. voice-family:inherit;
441. width: 123px;
442. }
443.  
444. html>body a.sublevel {width:123px;} /* Opera5-Fix-fix ;-) */
445.  
446. a.sublevel:hover, a.sublevel#active_menu {
447. text-decoration: none;
448. width: 139px;
449. voice-family:"\"}\""; /* Box Model fix */
450. voice-family:inherit;
451. width: 123px;
452. }
453. html>body a.sublevel:hover, a.sublevel#active_menu { /* Opera5-Fix-fix ;-) */
454. width: 123px;
455. }
456.  
457.  
458. /* Module specific */
459.  
460. #leftcol div.module div div div div.syndicate {
461. background: transparent;
462. width: 137px;
463. margin: 0px;
464. padding: 0px;
465. }
466.  
467. #leftcol div.module div div div div.syndicate div {
468. background: transparent;
469. width: 137px;
470. margin: 0px;
471. padding: 0px;
472. }
473.  
474.  
475. /* Other Mambo Stuff */
476.  
477. #title {
478. }
479. .pathway {
480. color: #BBBBBB;
481. font-size: 10px;
482. text-decoration: none;
483. font-weight: normal;
484. }
485.  
486. .pathway a{
487. color: #BBBBBB;
488. text-decoration: none;
489. font-weight: normal;
490. }
491.  
492. .mosimage {
493.   border: 1px solid #cccccc;
494.   margin: 5px
495. }
496.  
497. .mosimage_caption {
498.   margin-top: 2px;
499.   background: #efefef;
500.   padding: 1px 2px;
501.   color: #666;
502.   font-size: 10px;
503.   border-top: 1px solid #cccccc;
504. }
505.  
506. hr {
507. width:  90%;
508.  }
509. hr.separator {
510. width:  40%;
511.  }
512. a.pnav {
513. }
514. .pnav:hover {
515. }
516. .small {
517. font-size: 10px;
518. color: #ABABAB;
519. line-height: 0.7;
520. }
521. .smalldark {
522. font-size: 10px;
523. color: #000;
524. height: 10px;
525. line-height: 10px;
526. text-align: left;
527. }
528.  
529. .sectiontableentry1 {
530. text-align: left;
531. background: #EFEFEF;
532. font-size: 10px;
533. padding: 2px;
534. }
535. .sectiontableentry2 {
536. background: #FFF;
537. font-size: 10px;
538. text-align: left;
539. padding: 2px;
540. }
541. .button {
542. border: 1px solid #BBBBBB;
543. }
544. .inputbox {
545. border: 1px solid #BBBBBB;
546. }
547.  
548. .createdate {
549. font-size: 10px;
550. color: #ABABAB;
551. height: 10px;
552. line-height: 0.7;
553. }
554. .modifydate {
555. font-size: 10px;
556. color: #ABABAB;
557. height: 20px;
558. line-height: 20px;
559. margin-bottom: 5px;
560. }
561. a.readon {
562. font-size: 10px;
563. text-decoration: none;
564. line-height: 15px;
565. border: 1px solid #EEEEEE;
566. padding-left: 13px;
567. background: url(../images/readon.gif) no-repeat left;
568. margin-top: 10px;
569. text-decoration: none;
570. font-weight: normal;
571. }
572.  
573. .blog_more {
574. font-size: 10px;
575. }
576.  
577. a.readon:hover {
578. background: #EEEEEE url(../images/readon.gif) no-repeat left;
579. text-decoration: none;
580. }
581.  
582. .blog {
583. width: 100%;
584. }
585.  
586. .contentheading {
587. width: 98%;
588. font-weight: bold;
589. font-size: 16px;
590. height: 23px;
591. line-height: 20px;
592. border-bottom: 1px solid #002E61;
593. font-family: 'Trebuchet MS', verdana, sans-serif;
594. color: #002E61;
595. }
596.  
597. .contentpaneopen {
598. text-align: left;
599. background: transparent;
600. font-size: 10px;
601. line-height: 1.8;
602. }
603.  
604. table.contentpane td.contentheading {
605. font-weight: bold;
606. font-size: 16px;
607. height: 23px;
608. line-height: 20px;
609. font-family: 'Trebuchet MS', verdana, sans-serif;
610. border: none;
611. }
612.  
613. table.contentpane ul {
614. margin: 0px;
615. padding: 0px;
616. list-style: none;
617. }
618.  
619. table.contentpane ul li{
620. padding: 0px;
621. margin: 0px;
622. padding-left: 15px;
623. }
624.  
625. .contentdescription {
626. font-size: 10px;
627. }
628. .sectiontableheader {
629. font-weight: bold;
630. font-size: 10px;
631. height: 25px;
632. line-height: 25px;
633. }
634. .categorytitle {
635. font-weight: bold;
636. font-size: 16px;
637. height: 25px;
638. line-height: 25px;
639. font-family: "Trebuchet MS", Verdana, sans serif;
640. }
641. .componentheading {
642. font-weight: bold;
643. font-size: 16px;
644. height: 23px;
645. line-height: 20px;
646. font-family: "Trebuchet MS", Verdana, sans serif;
647. border-bottom: 1px solid #002E61;
648. color: #002E61;
649. margin-bottom: 5px;
650. }
651. a.category {
652. text-decoration:  underline;
653.  }
654. a.category:hover {
655. text-decoration:  underline;
656.  }
657. table.moduletable {
658. width:  100%;
659. font-size: 80%;
660.  }
661. table.moduletable th  {
662. font-size: 80%;
663. }
664.  
665. .poll {
666. font-size: 10px;
667. text-align: center;
668. }
669.  
670.  
671. .back_button a{
672. font-size: 10px;
673. font-weight: normal;
674. }
675.  
676. .blogsection {
677. font-size: 10px;
678. }
679.  
680. .blog_more ul li{
681. list-style: none;
682. padding-left: 14px;
683. line-height: 18px;
684. }
685.  
686. table.contenttoc {
687. border: 1px solid #CCCCCC;
688. padding: 3px;
689. }
690.  
691. table.contenttoc th{
692. font-weight: bold;
693. font-size: 10px;
694. border-bottom: 1px solid #BBBBBB;
695. }
696.  
697. form {
698. margin: 0px;
699. padding: 0px;
700. }

 

<div id="maincol-broad-800" > width: 600px всего
так же см. ширину вложенных див-ов и таблиц

 

я так понял, что в CSS можно не лезть, а править html, только вот все равно ничего не получается...
вот html код:

Код (CODE):

1. <?php defined( '_VALID_MOS' ) or die( 'Доступ ограничен' ); ?>
2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3. <?php $iso = split( '=', _ISO );
4. echo '<?xml version="1.0" encoding="'. $iso[1] .'"?' .'>';
5. ?>
6. <html xmlns="http://www.w3.org/1999/xhtml">
7. <head>
8. <meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
9. <?php mosShowHead(); ?>
10. <?php
11. if ( $my->id ) {
12.     initEditor();
13. }
14.  
15. if ((mosCountModules( 'user1' )) && (mosCountModules( 'user2' ))) {  
16. //если оба модуля включены, то для каждого выделяется 50% области
17.     $usera = 'user1';
18.     $userb = 'user2';
19. } else if ((mosCountModules( 'user1' )) || (mosCountModules( 'user2' ))) {
20. // если же один лишь модуль, то для него выделяется вся область, 100%
21.     $usera = 'user3';
22.     $userb = 'user3';
23. }
24. ?>
25. <meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
26. <link href="<?php echo $mosConfig_live_site; ?>/templates/madeyourweb/css/template_css.css" rel="stylesheet" type="text/css"/>
27. <link href="<?php echo $mosConfig_live_site; ?>/templates/madeyourweb/css/css_color_green.css" rel="stylesheet" type="text/css"/>
28. </head>
29. <body>
30. <div id="accessibility">
31.     <a href="index.php#menu">
32.         Меню</a>
33.     <a href="index.php#content">
34.         Содержимое</a>
35. </div>
36. <div id="pagewidth-950" >
37.     <div id="header" >
38.         <div id="top-top">
39.             <?php
40.             if (mosCountModules( "user4" )) {
41.                 ?>
42.                 <div id="search">
43.                     <?php mosLoadModules ( 'user4',-1); ?>
44.                 </div>
45.                 <?php
46.             }
47.             ?>
48.             <div id="topmenu">
49.                 <?php if (mosCountModules( "user3" )) { ?><?php mosLoadModules ( 'user3',-1); ?><?php } ?>
50.             </div>
51.         </div>
52.        
53.         <div class="clr"></div>
54.        
55.         <div id="top-bottom">
56.             <a href="index.php">
57.                 <?php echo '<img src="' .$mosConfig_live_site. '/templates/' .$GLOBALS['cur_template']. '/images/logo.gif" border="0" width="950" height="80" alt="Спорт и здоровый образ жизни" />'; ?>
58.                 </a>
59.         </div>
60.         <?php
61.         if (mosCountModules( "banner" )) {
62.             ?>
63.             <div id="banner">
64.                 <?php mosLoadModules ( 'banner',-1); ?>
65.             </div>
66.             <?php
67.         }
68.         ?>
69.     </div>
70.     <div id="outer-950" >
71.         <div id="pathway">
72.             <?php mospathway() ?>
73.         </div>
74.         <div id="leftcol">
75.             <a name="menu"></a>
76.             <?php
77.             if (mosCountModules( "left" )) {
78.                 mosLoadModules ( 'left',-3);
79.             }
80.             ?>
81.         </div>
82.         <?php
83.         if ((mosCountModules( "right" )) || (mosCountModules( "top" ))) {
84.             ?>
85.             <div id="maincol-broad-800" >
86.             <?php
87.         } else {
88.             ?>
89.             <div id="maincol-wide-950" >
90.             <?php
91.         }
92.             if (mosCountModules( "user1" )) {
93.                 ?>
94.                 <div id="<?php echo $usera; ?>">
95.                     <?php mosLoadModules ( 'user1',-2); ?>
96.                 </div>
97.                 <?php
98.             }
99.             if (mosCountModules( "user2" )) {
100.                 ?>
101.                 <div id="<?php echo $userb; ?>">
102.                     <?php mosLoadModules ( 'user2',-2); ?>
103.                 </div>
104.                 <?php
105.             }
106.             ?>
107.             <div class="clr"></div>
108.             <div class="content">
109.                 <a name="content"></a>
110.                 <?php mosMainBody(); ?>
111.             </div>
112.         </div>
113.         <?php
114.         if ((mosCountModules( "right" )) || (mosCountModules( "top" ))) {
115.             ?>
116.             <div id="rightcol-broad">
117.                 <?php mosLoadModules ( 'top',-7); ?>
118.                 <?php mosLoadModules ( 'right',-3); ?>
119.             </div>
120.             <?php
121.         }
122.         ?>
123.         <div class="clr"></div>
124.     </div>
125.  
126.     <div id="footer-950" >
127.         <?php include_once( $mosConfig_absolute_path .'/includes/footer.php' ); ?>
128.         <?php mosLoadModules( 'debug', -1 );?>
129.     </div>
130. </div>
131.  
132. </body>
133. </html>

 

неужели больше никто не знает?...(

 

Яуген, если хочешь сделать резиновый шаблон, используй просто таблицу. Левую колонку, центральную и правую сделай столбцами. Опиши их ширину: левую и правую сделай фиксированной, а центральную пропиши ширину в 100%.

 

liga, если бы вопрос был в этом - я бы не выкладывал код, а я хочу чтобы мне помогли разобраться в нем, не меняя таблицу на столбцы

 

Яуген, Это ведь madeyourweb в Лавре?

 

да, он самый... что только я не пробовал менять - все равно все получается криво

 

Яуген, <div id="outer-900" > Получается, что в нем начинается строка pathway (Ширина 500) потом идет разбиение на левую колонку (leftcol 152) и центральную(maincol-broad-800 на 600 точек). В CSS outer-900 он вроде бы не описан, попробуй поэксперементировать с его шириной.

 

меняю в html коде <div id="outer-900" > на 800, правая колонка становиться на свое место, как она должна быть при нерастянутой странице (как в неизмененном шаблоне), если изменяю 800 на другое значение - она нормально становится справа...

 

кароч спасибо всем за помощь, я уже поставил нормальный резиновый шаблон, надоело с этим копаться)