Запуталась с шапкой шаблона.

Тема в разделе "Создание шаблона", создана пользователем liska77, 08.01.2010.

  1. Offline

    liska77 Недавно здесь

    Регистрация:
    01.07.2008
    Сообщения:
    7
    Симпатии:
    0
    Пол:
    Женский
    Идея была такая:
    взяла готовый шаблон, чтоб меньше мучаться.
    Было: резина, слева картинка, под ней - меню. Потом в шапке рисунок (замостить), а под ним - вторая колонка.
    Добавила третью колонку (справа). В шапке хотела, чтобы резиной тянулась середина (там мостилось), а слева и справа над столбцами - рисунки.
    Вот, что в итоге:
    http://dion.diapazon.com.ua/ (тестовый хост)

    Да! Вот файл CSS, кажется, проблема в нем.

    Код (html):
    1. /* CSS Document */
    2.  
    3. html {
    4. height : 100%;
    5. }
    6. body {
    7. line-height : 100%;
    8. background : #f9f9f9;
    9. color : #151515;
    10. font-family : Verdana, Arial, Helvetica, sans-serif;
    11. }
    12. .clr {
    13. clear : both;
    14. }
    15. .outline {
    16. background : #ffffff;
    17. background-image: url(../images/index_r5_c1.jpg);
    18. color : #151515;
    19. border : 1px solid #8cc544;
    20. padding : 4px;
    21. }
    22. #buttons_outer {
    23. float : left;
    24. margin-bottom : 2px;
    25. height : 22px;
    26. }
    27. #buttons_inner {
    28. height : 20px;
    29. background-color : #f9f9f9;
    30. }
    31. #pathway_text {
    32. overflow : hidden;
    33. display : block;
    34. height : 18px;
    35. line-height : 20px !important;
    36. line-height : 20px;
    37. color : #151515;
    38. }
    39. #pathway_text img {
    40. margin-left : 5px;
    41. margin-right : 5px;
    42. }
    43. #buttons {
    44. float : left;
    45. width : auto;
    46. }
    47. #top {
    48.     background-image : url(../images/index_r2_c1.jpg);
    49.     height : 66px;
    50.     background-repeat : repeat-x;
    51.     width : 100%;
    52.     margin-top : 2px;
    53.     float : left;
    54. }
    55. ul#mainlevel-nav {
    56. list-style : none;
    57. font-size : 16px;
    58. }
    59. ul#mainlevel-nav li {
    60. float : left;
    61. font-size : 16px;
    62. font-weight : bold;
    63. line-height : 58px;
    64. font-family : Geneva, Arial, Helvetica, sans-serif;
    65. white-space : nowrap;
    66. border-right : 2px solid #ffffff;
    67. padding-top : 2px;
    68. margin-top : 4px;
    69. display : block;
    70. }
    71. ul#mainlevel-nav li a {
    72. display : block;
    73. padding-left : 5px;
    74. padding-right : 5px;
    75. text-decoration : none;
    76. color : #f4f4f4;
    77. }
    78. #buttons > ul#mainlevel-nav li a {
    79. width : auto;
    80. }
    81. ul#mainlevel-nav li a:hover {
    82. color : #000;
    83. }
    84. #search_outer {
    85. float : left;
    86. width : 185px;
    87. height : 22px;
    88. margin-bottom : 2px;
    89. }
    90. #search_inner {
    91. height : 19px !important;
    92. height : 20px;
    93. overflow : hidden;
    94. width : 140px;
    95. margin-left : 18px;
    96. }
    97. #search_inner form {
    98. padding : 2px;
    99. margin : 2px;
    100. }
    101. #search_inner .inputbox {
    102. font-family : Verdana, Arial, Helvetica, sans-serif;
    103. font-size : 11px;
    104. color : #131313;
    105. background-color : #f9f9f9;
    106. }
    107. #header {
    108. float : right;
    109. background-image : url(../images/index_r1_c1.jpg);
    110. height : 130px;
    111. width : 100%;
    112. background-repeat : repeat-x;
    113. }
    114. #left_outer {
    115. float : left;
    116. width : 160px;
    117. }
    118. #left_inner {
    119. float : none !important;
    120. float : left;
    121. }
    122. #content-main {
    123. float : left;
    124. }
    125. .content_main_inner {
    126. float : left;
    127. width : 99%;
    128. padding : 4px;
    129. }
    130. #content_inner {
    131. float : none !important;
    132. float : left;
    133. padding-top : 2px;
    134. }
    135. #left_top_outer {
    136. background-image : url(../images/head.gif);
    137. height : 130px;
    138. background-repeat : no-repeat;
    139. }
    140. #right_top_outer {
    141. float : none;
    142. background-image : url(../images/head1.jpg);
    143. height : 130px;
    144. background-repeat : no-repeat;
    145. }
    146. #right_top_inner {
    147.     float : none !important;
    148.     float : left;
    149.     padding-left : 12px;
    150.     padding-right : 28px;
    151.     padding-top: 4px;
    152. }
    153. #right_inner {
    154. float : none !important;
    155. float : left;
    156. padding-left : 12px;
    157. padding-right : 26px;
    158. }
    159. #right_bottom {
    160.     width : 150px;
    161.     margin-top: 8px;
    162. }
    163. .right_bottom_inner {
    164. padding-left : 12px;
    165. padding-right : 2F6px;
    166. }
    167. .user1_inner {
    168. float : none !important;
    169. float : left;
    170. }
    171. .user2_inner {
    172. float : none !important;
    173. float : left;
    174. }
    175. .maintitle {
    176. color : #ffffff;
    177. font-size : 36px;
    178. padding-left : 25px;
    179. padding-top : 65px;
    180. font-family : Georgia, "Times New Roman", Times, serif;
    181. font-weight : bold;
    182. }
    183. .error {
    184. font-style : italic;
    185. text-transform : uppercase;
    186. padding : 5px;
    187. color : #4d93e8;
    188. font-size : 14px;
    189. font-weight : bold;
    190. }
    191. .back_button {
    192. float : left;
    193. text-align : center;
    194. font-size : 11px;
    195. font-weight : bold;
    196. border : 3px double #cccccc;
    197. width : auto;
    198. padding : 0 10px;
    199. line-height : 20px;
    200. margin : 1px;
    201. }
    202. .pagenav {
    203. text-align : center;
    204. font-size : 11px;
    205. font-weight : bold;
    206. border : 3px double #cccccc;
    207. width : auto;
    208. background : url(../images/menu.gif) repeat-x;
    209. padding : 0 10px;
    210. line-height : 20px;
    211. margin : 1px;
    212. color : #151515;
    213. }
    214. .pagenavbar {
    215. margin-right : 10px;
    216. float : right;
    217. }
    218. #footer {
    219. background-image : url(../images/index_r5_c1.jpg);
    220. background-repeat : repeat-x;
    221. height : 77px;
    222. float : left;
    223. width : 100%;
    224. }
    225. #footer_inner {
    226. padding-top : 8px;
    227. }
    228. ul {
    229. margin : 0;
    230. padding : 0;
    231. list-style : none;
    232. }
    233. li {
    234. line-height : 15px;
    235. padding-left : 15px;
    236. padding-top : 2px;
    237. margin-left : 2px;
    238. background-image : url(../images/arrow.gif);
    239. background-repeat : no-repeat;
    240. background-position : 0 2px;
    241. }
    242. td {
    243. text-align : left;
    244. font-size : 11px;
    245. }
    246. a:link, a:visited {
    247. color : #151515;
    248. text-decoration : none;
    249. font-weight : bold;
    250. }
    251. a:hover {
    252. color : #bd0000;
    253. text-decoration : none;
    254. font-weight : bold;
    255. }
    256. table.contentpaneopen {
    257. width : 99%;
    258. }
    259. table.contentpane {
    260. width : 99%;
    261. }
    262. table.contentpaneopen fieldset {
    263. border-bottom : 1px solid #eee;
    264. }
    265. .button {
    266. color : #4f4f4f;
    267. font-family : Arial, Hevlvetica, sans-serif;
    268. text-align : center;
    269. font-size : 11px;
    270. font-weight : bold;
    271. border : 3px double #cccccc;
    272. width : auto;
    273. padding : 0 5px;
    274. line-height : 18px !important;
    275. line-height : 16px;
    276. height : 26px !important;
    277. height : 24px;
    278. margin : 1px;
    279. }
    280. .inputbox {
    281. padding : 2px;
    282. border : 1px dashed #cccccc;
    283. background-color : #f9f9f9;
    284. }
    285. .componentheading {
    286. color : #151515;
    287. text-align : left;
    288. padding-top : 4px;
    289. padding-left : 4px;
    290. height : 22px;
    291. font-weight : bold;
    292. font-size : 10px;
    293. text-transform : uppercase;
    294. }
    295. .contentcolumn {
    296. padding-right : 5px;
    297. }
    298. .contentheading {
    299. height : 24px;
    300. color : #131313;
    301. background-color : #ededed;
    302. font-weight : bold;
    303. font-size : 14px;
    304. white-space : nowrap;
    305. }
    306. .contentpagetitle {
    307. font-size : 13px;
    308. font-weight : bold;
    309. color : #f4f4f4;
    310. text-align : left;
    311. }
    312. table.searchinto {
    313. width : 100%;
    314. }
    315. table.searchintro td {
    316. font-weight : bold;
    317. }
    318. table.moduletable {
    319. width : 100%;
    320. margin-bottom : 10px;
    321. }
    322. div.moduletable {
    323. margin-bottom : 2px;
    324. }
    325. table.moduletable th, div.moduletable h3 {
    326. color : #151515;
    327. background-color: #ededed;
    328. text-align : left;
    329. padding-left : 4px;
    330. height : 22px;
    331. line-height : 22px;
    332. font-weight : bold;
    333. font-size : 12px;
    334. text-transform : uppercase;
    335. margin : 0 0 2px;
    336. }
    337. table.moduletable td {
    338. font-size : 11px;
    339. font-weight : normal;
    340. }
    341. table.pollstableborder td {
    342. padding : 2px;
    343. }
    344. .sectiontableheader {
    345. font-weight : bold;
    346. background : #f0f0f0;
    347. padding : 4px;
    348. }
    349. .sectiontableentry1 {
    350. background-color : #ffffff;
    351. border : 1px dashed #999999;
    352. }
    353. .sectiontableentry2 {
    354. background-color : #f9f9f9;
    355. border : 1px dashed #999999;
    356. }
    357. .small {
    358. color : #999999;
    359. font-size : 11px;
    360. }
    361. .createdate {
    362. height : 15px;
    363. padding-bottom : 4px;
    364. color : #8cc544;
    365. font-size : 11px;
    366. }
    367. .modifydate {
    368. height : 15px;
    369. padding-top : 10px;
    370. color : #999999;
    371. font-size : 11px;
    372. }
    373. table.contenttoc {
    374. border : 1px solid #cccccc;
    375. padding : 2px;
    376. margin-left : 2px;
    377. margin-bottom : 2px;
    378. }
    379. table.contenttoc td {
    380. padding : 2px;
    381. }
    382. table.contenttoc th {
    383. color : #4d93e8;
    384. text-align : left;
    385. padding-top : 2px;
    386. padding-left : 4px;
    387. height : 22px;
    388. font-weight : bold;
    389. font-size : 10px;
    390. text-transform : uppercase;
    391. }
    392. a.mainlevel:link, a.mainlevel:visited {
    393. display : block;
    394. background : url(../images/menu_bg.jpg) no-repeat;
    395. vertical-align : middle;
    396. font-size : 11px;
    397. font-weight : bold;
    398. color : #151515;
    399. text-align : left;
    400. padding-top : 5px;
    401. padding-left : 5px;
    402. padding-right: 5px;
    403. height : 20px !important;
    404. height : 25px;
    405. text-decoration : none;
    406. }
    407. a.mainlevel:hover {
    408. font-size : 12px;
    409. background-position : 0 -25px;
    410. text-decoration : none;
    411. color : #bd0000;
    412. text-align : right;
    413. }
    414. a.mainlevel#active_menu {
    415. color : #4d93e8;
    416. font-weight : bold;
    417. height : 20px !important;
    418. height : 25px;
    419. text-decoration : none;
    420. }
    421. a.mainlevel#active_menu:hover {
    422. color : #bd0000;
    423. }
    424. a.sublevel:link, a.sublevel:visited {
    425. padding-left : 1px;
    426. padding-top : 6px;
    427. vertical-align : middle;
    428. font-size : 10px;
    429. font-weight : bold;
    430. color : #151515;
    431. text-align : left;
    432. height : 20px !important;
    433. height : 25px;
    434. text-decoration : none;
    435. }
    436. a.sublevel:hover {
    437. color : #bd0000;
    438. text-decoration : none;
    439. }
    440. a.sublevel#active_menu {
    441. color : #4d93e8;
    442. }
    443. .highlight {
    444. background-color : yellow;
    445. color : blue;
    446. padding : 0;
    447. }
    448. .code {
    449. background-color : #ddd;
    450. border : 1px solid #bbb;
    451. }
    452. form {
    453. margin : 0;
    454. padding : 0;
    455. }
    456. div.mosimage {
    457. border : 1px solid #ccc;
    458. }
    459. .mosimage {
    460. border : 1px solid #cccccc;
    461. margin : 5px;
    462. }
    463. .mosimage_caption {
    464. margin-top : 2px;
    465. background : #ededed;
    466. padding : 1px 2px;
    467. color : #151515;
    468. font-size : 10px;
    469. border-top : 1px solid #cccccc;
    470. }
    471. span.article_seperator {
    472. display : block;
    473. height : 1.5em;
    474. }


    Подскажите, что делать! Я в верстке пока что новичок. Все так сложно :[
     
    liska77, 08.01.2010
    #1

  2. Наши спонсоры

     
< Помогите убрать отсупы пожалуйста в крышке статьей блогов и материалов | Резиновый шаблон из 3-ёх div - ов >

Поделиться этой страницей

Загрузка...