Votre question

[RESOLU] Problème de prog de débutant PHP et CSS

Tags :
  • CSS
  • Programmation
Dernière réponse : dans Programmation
19 Juin 2011 02:24:00

Salut à tous

j'ai un petit problème de programmation. Je le sens bien que c'est un problème de débutant mais je vois pas comment le résoudre.
En fait j'essais de modifier un thème wordpress, mais mon soucis c'est que j'arrive pas à organiser mes articles dans la page d'accueil. Voici le site pour voir directement

http://kimpap.fr

On voit bien que les articles s'entassent sur la gauche .... allez savoir pourquoi .....

Voici mon fichier d'index et mon css

index.php
  1. <?php get_header(); ?>
  2.  
  3. <div id="featured">
  4. <?php include (TEMPLATEPATH . '/glide.php'); ?>
  5. </div>
  6. <div class="clear"></div>
  7. <div id="menucontainer">
  8. <div id="menu">
  9. <ul>
  10. <li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
  11. <?php wp_list_pages('title_li=&depth=4&sort_column=menu_order'); ?>
  12. </ul>
  13. </div>
  14. </div>
  15. <div id="contentarea">
  16.  
  17. <?php if (have_posts()) : ?>
  18. <?php while (have_posts()) : the_post(); ?>
  19.  
  20. <?php $count = 0; ?>
  21.  
  22.  
  23. <div class="mag" id="post-<?php the_ID(); ?>">
  24.  
  25. <div class="title">
  26.  
  27. <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Lire <?php the_title(); ?>"><?php the_title(); ?></a></h2>
  28.  
  29. <!-- <div class="date"> <span class="author"> <?php the_author(); ?> </span><span class="comm"><?php comments_popup_link('ADD COMMENTS', '1 COMMENT', '% COMMENTS'); ?></span> </div> -->
  30.  
  31. </div>
  32.  
  33.  
  34. <div class="entrycover">
  35. <div class="entry">
  36.  
  37. <a href="<?php the_permalink() ?>" rel="bookmark" title="Lire <?php the_title(); ?>"> <?php thumb_image(); ?></a>
  38. <!-- <?php the_excerpt(); ?> -->
  39. <br>
  40. <!-- <div class="readmore"><a href="<?php the_permalink() ?>" title="Permanent Link to <?php the_title(); ?>"> READ MORE </a></div> -->
  41.  
  42. <div class="clear"></div>
  43.  
  44. </div>
  45.  
  46. </div>
  47.  
  48. </div>
  49. <?php if(++$counter % 2 == 0) : ?>
  50. <div class="clear"></div>
  51. <?php endif; ?>
  52. <?php endwhile; ?>
  53. <div id="navigation">
  54. <div class="leftalign"><?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } ?></div>
  55.  
  56. </div>
  57.  
  58.  
  59. <?php else : ?>
  60.  
  61. <h1 class="title">Not Found</h1>
  62. <p>Sorry, but you are looking for something that isn't here.</p>
  63.  
  64. <?php endif; ?>
  65.  
  66.  
  67. </div>
  68.  
  69. <!-- <?php get_sidebar(); ?> -->
  70.  
  71. <?php get_footer(); ?>



style.css
  1. /*
  2. Theme Name:foodpress
  3. Description: A free premium food & diet WordPress theme from binuthemes.
  4. Author: Binu
  5. Author URI: <a href="http://www.binuthemes.com" rel="nofollow" target="_blank">www.binuthemes.com</a>
  6. */
  7.  
  8. html, body, div, span, applet, object, iframe,
  9. h1, h2, h3, h4, h5, h6, p,
  10. blockquote, pre, a, abbr, acronym, address, big,
  11. cite, code, del, dfn, em, font, img,
  12. ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
  13. fieldset, form, label, legend,
  14. table, caption, tbody, tfoot, thead, tr, th, td,
  15. center, u, b, i, marquee {
  16. margin: 0px;
  17. padding: 0px;
  18. border: 0px;
  19. outline: 0px;
  20. vertical-align: baseline;
  21. }
  22.  
  23.  
  24. body {
  25. margin:0 auto;
  26. padding:0px 0px 0px 0px;
  27. background-image:url(<a href="http://kimpap.fr/wp-content/themes/foodpress/images/fond.jpg" rel="nofollow" target="_blank">http://kimpap.fr/wp-content/themes/foodpress/images/fon...</a>);
  28. background-position:center center;
  29. background-repeat:repeat-y;
  30. font-family:Century gothic, Arial,Tahoma,sans-serif;
  31. color:#161514;
  32. font-size:13px;
  33. }
  34. img {
  35. border:0;
  36. margin: 0 0;
  37. }
  38. a {
  39. color:#6F615A;
  40. text-decoration:none;
  41. outline:none;
  42. }
  43. a:hover {
  44. color:#d53030;
  45. text-decoration:none
  46. }
  47. h1, h2, h3, h4, h5, h6 {
  48.  
  49. }
  50. blockquote {
  51. padding-left:20px;
  52. color:#000;
  53. border-left: 0px;
  54. background:transparent url(images/openquote.gif)no-repeat top left;
  55. font-style: normal;
  56. }
  57. .clear {
  58. clear:both;
  59. }
  60.  
  61. img.centered {
  62. display: block;
  63. margin-left: auto;
  64. margin-right: auto;
  65. margin-bottom: 10px;
  66. padding: 0px;
  67. }
  68.  
  69. img.alignnone {
  70. padding: 5px 5px;
  71. margin: 0px 0px 10px 0px;
  72. display: inline;
  73. background:#fff;
  74. border: 1px solid #DDDDDD;
  75. }
  76.  
  77. img.alignright {
  78. padding: 5px 5px;
  79. margin: 0px 5px 10px 10px;
  80. display: inline;
  81. background:#fff;
  82. border: 1px solid #DDDDDD;
  83. float:right;
  84. }
  85.  
  86. img.alignleft {
  87. padding: 5px 5px;
  88. margin: 5px 10px 10px 0px;
  89. display: inline;
  90. background:#fff;
  91. border: 1px solid #DDDDDD;
  92. float:left;
  93. }
  94.  
  95. .aligncenter {
  96. display: block;
  97. margin-left: auto;
  98. margin-right: auto;
  99. margin-bottom: 10px;
  100. }
  101.  
  102. .rightalign {
  103. float: right;
  104. margin: 0px 0px 10px 10px;
  105. }
  106.  
  107. .leftalign {
  108. float: left;
  109. margin: 0px 10px 10px 0px;
  110. }
  111.  
  112. .wp-caption {
  113. border: 1px solid #DDDDDD;
  114. text-align: center;
  115. background-color: #ffffff;
  116. padding: 4px 0px 5px 0px;
  117. margin: 5px 5px ;
  118. }
  119.  
  120. .wp-caption img {
  121. margin: 0px 0px 5px 0px;
  122. padding: 0px;
  123. border: 0px;
  124.  
  125. }
  126.  
  127. .wp-caption p.wp-caption-text {
  128. margin: 0px;
  129. padding: 0px 0px 0px 0px;
  130. font-size: 11px;
  131. font-weight: normal;
  132. line-height: 12px;
  133. }
  134.  
  135.  
  136. /* The Outer cover */
  137.  
  138. #wrapper {
  139. width:1000px;
  140. margin:0 auto;
  141. background: #033f5c;
  142. }
  143.  
  144. #container {
  145. padding:0px 0px 10px 0px;
  146. background:#E8FDA5;
  147. }
  148.  
  149.  
  150.  
  151. /* The Header */
  152.  
  153. #header {
  154.  
  155. height:100px;
  156. background: #F3F557;
  157.  
  158. }
  159.  
  160. .blogname {
  161. text-align:left;
  162. font-family:Arial black,Tahoma,Verdana,Georgia,Century gothic,sans-serif;
  163. margin:0px 0 0 0px;
  164. width: 650px;
  165.  
  166. }
  167.  
  168. .blogname h1 {
  169. font-size:32px;
  170. padding:10px 0 0px 20px;
  171. font-weight:normal;
  172. margin:0px 0 0 20px;
  173. font-style:Italic;
  174.  
  175.  
  176. }
  177. .blogname h1 a:link, .blogname h1 a:visited{
  178. color: #fff;
  179. font-weight:normal;
  180. }
  181.  
  182. .blogname h1 a:hover {
  183. color: #eee;
  184. }
  185.  
  186.  
  187. .blogname h2 {
  188. padding:10px 0px 0px 40px;
  189. font-size:14px;
  190. color:#fff;
  191. font-family:georgia,Century gothic,Verdana,Tahoma,sans-serif;
  192.  
  193. }
  194.  
  195.  
  196. /* The Search */
  197.  
  198. #search {
  199.  
  200. height: 35px;
  201. width: 316px;
  202. margin-top:8px;
  203. margin-bottom:10px;
  204. padding:6px 0px 5px 5px;
  205. float:right;
  206. display: inline;
  207.  
  208. }
  209.  
  210. #search form {
  211. margin: 0;
  212. padding: 0;
  213. }
  214.  
  215. #search fieldset {
  216. margin: 0;
  217. padding: 0;
  218. border: none;
  219. }
  220.  
  221. #search p {
  222. margin: auto;
  223. font-size: 85%;
  224.  
  225. }
  226.  
  227. #s {
  228. float: left;
  229. width:220px;
  230. padding: 4px 5px 4px 5px;
  231. background:#ececec;
  232. border:1px solid #464f46;
  233. font: normal 100% "Tahoma", Arial, Helvetica, sans-serif;
  234. color:#000;
  235. margin-right:2px;
  236. margin-top:3px;
  237.  
  238. }
  239.  
  240. input#searchsubmit {
  241. width:70px;
  242. float: right;
  243. background:#DFE135;
  244. border:1px solid #9A9B24;
  245. font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  246. color: #FFFFFF;
  247. height:25px;
  248. line-height:20px;
  249. margin-right:8px;
  250. margin-top:4px;
  251. }
  252.  
  253.  
  254. /* menu*/
  255.  
  256. #menucontainer{
  257. height:38px;
  258. width: 1000px;
  259. display:block;
  260. font: 12px Tahoma,Century gothic,verdana, Arial, sans-serif;
  261. font-weight:normal;
  262. text-transform:uppercase;
  263.  
  264. }
  265.  
  266. #menu{
  267. height:38px;
  268. width: 1000px;
  269. background: #DFE135;
  270.  
  271. }
  272.  
  273. #menu ul {
  274. float: left;
  275. list-style: none;
  276. margin: 0px;
  277. padding: 0px;
  278.  
  279. }
  280.  
  281. #menu li {
  282. float: left;
  283. list-style: none;
  284. margin: 0px;
  285. padding: 0px;
  286. }
  287.  
  288. #menu li:active {
  289.  
  290. }
  291.  
  292. #menu li a, #menu li a:link, #menu li a:visited {
  293. color: #fff;
  294. display: block;
  295. margin: 0px;
  296. padding: 12px 15px 12px 15px;
  297. font-weight: bold;
  298.  
  299. }
  300.  
  301. #menu li a:hover, #menu li a:active {
  302. color: #eee;
  303. margin: 0px;
  304. padding: 12px 15px 12px 15px;
  305. text-decoration: none;
  306. background: #9A9B24;
  307. }
  308.  
  309. #menu li li a, #menu li li a:link, #menu li li a:visited {
  310.  
  311. background: #9A9B24;
  312. width: 150px;
  313. color: #eee;
  314. font-family: tahoma, century gothic,Georgia, sans-serif;
  315. font-weight: bold;
  316. text-transform: uppercase;
  317. float: none;
  318. margin: 0px;
  319. padding: 9px 10px 9px 10px;
  320.  
  321. }
  322.  
  323. #menu li li a:hover, #menu li li a:active {
  324. color: #eee;
  325. padding: 9px 10px 9px 10px;
  326. background: #9A9B24;
  327. }
  328.  
  329. #menu li ul {
  330. z-index: 9999;
  331. position: absolute;
  332. left: -999em;
  333. height: auto;
  334. width: 170px;
  335. margin: 0px;
  336. padding: 0px;
  337. }
  338.  
  339. #menu li li {
  340. }
  341.  
  342. #menu li ul a {
  343. width: 140px;
  344. }
  345.  
  346. #menu li ul a:hover, #menu li ul a:active {
  347. }
  348.  
  349. #menu li ul ul {
  350. margin: -31px 0 0 170px;
  351. }
  352.  
  353. #menu li:hover ul ul, #menu li:hover ul ul ul,
  354. #menu li.sfhover ul ul, #menu li.sfhover ul ul ul {
  355. left: -999em;
  356. }
  357.  
  358. #menu li:hover ul, #menu li li:hover ul,
  359. #menu li li li:hover ul, #menu li.sfhover ul,
  360. #menu li li.sfhover ul, #menu li li li.sfhover ul {
  361. left: auto;
  362. }
  363.  
  364. #menu li:hover, #menu li.sfhover {
  365. position: static;
  366. }
  367.  
  368.  
  369. /* Main Content*/
  370.  
  371. #contentarea {
  372. position:relative;
  373. right:10px;
  374. float:left;
  375. width:985px;
  376. height:100%;
  377. padding:0px 0px 0px 0px;
  378. margin: 10px 0 0 15px;
  379. border: 1px solid #d5c488;
  380. }
  381.  
  382.  
  383. .title{
  384. margin: 0 0 0 5px;
  385. padding: 0px 0px 0px 0px;
  386.  
  387. }
  388.  
  389. .date {
  390. font-size:10px;
  391. font-family:Tahoma, century gothic,Arial,Verdana,Helvitica,sans-serif;
  392. padding:5px 5px 5px 0px;
  393. color:#000;
  394. text-transform: uppercase;
  395. margin-bottom:3px;
  396.  
  397. }
  398.  
  399. .post {
  400. width:625px;
  401. margin: 10px 0px 20px 0px;
  402. height:100%;
  403. color:#e9e9e9;
  404. padding:5px 5px;
  405. border: 1px solid #d5c488;
  406. font: 13px tahoma, georgia, century gothic,Arial,verdana, sans-serif;
  407. }
  408.  
  409. .post ul, .post ol{
  410. margin: .4em 0 1em;
  411. line-height: 150%;
  412. }
  413.  
  414.  
  415. .post ul li, .post ol li{
  416. list-style-position:outside;
  417. margin-left: 1.6em;
  418. }
  419.  
  420. .post h2 {
  421. margin: 0 0 5px 0;
  422. padding: 0px 0px 5px 5px;
  423. text-align: left;
  424. font: 22px Tahoma,century gothic,Arial,verdana,Georgia,sans-serif;
  425. font-weight:bold;
  426. overflow:hidden;
  427.  
  428. }
  429.  
  430. .post h2 a, .post h2 a:link, .post h2 a:visited {
  431. color:#000;
  432. background-color: transparent;
  433. }
  434. .post h2 a:hover {
  435. color: #3e1710;
  436. background-color: transparent;
  437. }
  438.  
  439. .author{
  440. color:#000;
  441. padding:2px 5px 2px 20px;
  442. margin-left:5px;
  443. background:url(images/author.png) no-repeat;
  444. }
  445. .clock{
  446.  
  447. padding:2px 5px 2px 20px;
  448. margin-top:5px;
  449. margin-left:5px;
  450. margin-right: 5px;
  451. color: #000;
  452. background:url(images/clock.png) no-repeat;
  453. }
  454.  
  455. .pagetitle h2 {
  456. color:#000;
  457. }
  458.  
  459.  
  460. .comm a{
  461. padding:2px 5px 2px 20px;
  462. margin-top:5px;
  463. margin-left:5px;
  464. margin-right: 5px;
  465. color: #000;
  466. background:url(images/comment.png) no-repeat;
  467. }
  468.  
  469.  
  470. .comm a:link,
  471. .comm a:visited {
  472. color:#000;
  473. }
  474. .comm a:hover{
  475. color:#e00000;
  476. }
  477.  
  478. .more{
  479. padding:5px 0 2px 10px;
  480. background:url(images/add.png) no-repeat;
  481. margin-right:5px;
  482. float:right;
  483. width:77px;
  484. height:20px;
  485. font: 10px Tahoma,century gothic,Arial,verdana, sans-serif;
  486. }
  487.  
  488. .more a:link,
  489. .more a:visited {
  490. color:#fff;
  491. }
  492. .more a:hover{
  493. color:#fff;
  494. }
  495.  
  496.  
  497. .postdivide {
  498.  
  499. margin:0px 0px;
  500. margin-bottom: 10px;
  501. padding: 0px 0px 5px 0px;
  502. font:10px Georgia, Arial,century gothic,verdana, sans-serif;
  503.  
  504. }
  505.  
  506. .postmore{
  507. padding:0px 5px 2px 25px;
  508. float:left;
  509. font-weight:bold;
  510. background:url(images/pmore.jpg) left no-repeat;
  511.  
  512. }
  513.  
  514. .postmore a:link,
  515. .postmore a:visited {
  516.  
  517. color:#fff;
  518.  
  519. }
  520. .postmore a:hover{
  521.  
  522. color:#fff;
  523. }
  524. .category{
  525. font-size:10px;
  526. font-family:Tahoma, century gothic,Arial,Verdana,Helvitica,sans-serif;
  527. text-transform: uppercase;
  528. padding:3px 5px 3px 0px;
  529. }
  530.  
  531. .category a:link,.category a:visited{
  532. color:#000;
  533.  
  534. }
  535.  
  536. .category a:hover{
  537. color:#d9892a;
  538. }
  539.  
  540. .entry {
  541. margin:0 0;
  542. padding: 0px 5px 5px 5px;
  543.  
  544. }
  545.  
  546. .entry a:link,
  547. .entry a:visited {
  548. color: #AC0604;
  549. background-color: transparent;
  550. }
  551. .entry a:hover {
  552. color:#e48d0c;
  553. background-color: transparent;
  554. text-decoration: none;
  555. }
  556.  
  557. .entry img{
  558. float:left;
  559. margin:5px 10px;
  560. border:4px solid #fff;
  561. height: 150px;
  562. width: 150px;
  563. }
  564.  
  565. .entry p{
  566. margin:5px 0px;
  567. padding:5px 5px;
  568. line-height:20px;
  569. color: #000;
  570.  
  571. }
  572. .entry pre,address,ul,li,h1,h2,h3,h4,h5,h6,dl,dt,table{
  573. color:#000;
  574. }
  575. .entry table,th,td {
  576. border-style:solid;
  577. border-width:1px;
  578. border-color:#000;
  579. padding:1px 1px 1px 1px;
  580. }
  581.  
  582. #soc {
  583. height:25px;
  584. width:100%;
  585. background:#000;
  586. }
  587.  
  588. /* magazine layout */
  589.  
  590.  
  591. .mag{
  592.  
  593. width:180px;
  594. float:left;
  595. padding:0px 0px;
  596. margin:10px 8px 0px 0px;
  597. border: 1px solid #d5c488;
  598. }
  599.  
  600.  
  601. .mag h2 {
  602. margin: 0 0 5px 0;
  603. padding: 10px 0px 5px 10px;
  604. text-align: left;
  605. font: 20px Tahoma,century gothic,Arial,verdana,Georgia,sans-serif;
  606. font-weight:bold;
  607. overflow:hidden;
  608.  
  609.  
  610. }
  611.  
  612. .mag h2 a, .mag h2 a:link, .mag h2 a:visited {
  613. color:#000;
  614. background-color: transparent;
  615. }
  616. .mag h2 a:hover {
  617. color: #F3F557;
  618. background-color: transparent;
  619. }
  620.  
  621. img.thumb{
  622. width: 150px;
  623. float:left;
  624. margin:5px 10px 5px 5px;
  625. border:4px solid #FDD533;
  626. height: 150px;
  627.  
  628.  
  629. }
  630.  
  631. .readmore {
  632. width: 100px;
  633. height: 20px;
  634. background: #E4EA28;
  635. float: right;
  636. padding-top:4px;
  637. text-align:center;
  638. border: 1px solid #eee;
  639. }
  640.  
  641. .readmore a:link,.readmore a:visited {
  642. color:#fff;
  643. font-size:12px;
  644. font-weight: bold;
  645.  
  646. }
  647. /* right column */
  648. #rightcol{
  649. float:right;
  650. width:320px;
  651. margin:10px 10px 0px 0px;
  652.  
  653. }
  654.  
  655. /*sidebar */
  656. h3.sidetil{
  657. padding: 15px 0px 0px 55px;
  658. color:#fff;
  659. font-size:20px;
  660.  
  661. }
  662. .sidetitl{
  663. padding: 10px 0px 5px 10px;
  664. color:#fff;
  665. font-size:16px;
  666. width:320px;
  667. height:25px;
  668. background: #E4EA28;
  669. position:relative;
  670. font-family:Tahoma,Century gothic,Tahoma, Arial,Georgia, sans-serif;
  671. text-transform:uppercase;
  672.  
  673.  
  674. }
  675.  
  676. .sidebox{
  677. float:left;
  678. width:320px;
  679. padding-top:0px;
  680. font-size:11px;
  681. font-family:Tahoma,Century gothic, Arial, sans-serif;
  682. margin-bottom:15px;
  683. background: #E8FDA5;
  684. overflow:hidden;
  685. border: 1px solid #ffffff;
  686. }
  687.  
  688. li.recentcomments{
  689. padding:5px 5px;
  690. line-height:18px;
  691. }
  692.  
  693. .sidebox ul {
  694. list-style-type: none;
  695. margin: 0 ;
  696. padding: 0;
  697.  
  698. }
  699. .sidebox li{
  700. list-style-type: none;
  701. margin: 0 ;
  702. padding: 0;
  703.  
  704. }
  705. .sidebox ul ul {
  706. list-style-type: none;
  707. margin: 0;
  708. padding: 0px 0px 10px 0px;
  709. background-repeat:no-repeat;
  710. }
  711.  
  712. .sidebox ul ul ul {
  713. list-style-type: none;
  714. margin: 0;
  715. padding: 0;
  716. border:0;
  717. }
  718.  
  719. .sidebox ul ul ul ul {
  720. list-style-type: none;
  721. margin: 0;
  722. padding: 0;
  723. border:0;
  724.  
  725. }
  726.  
  727. .sidebox ul li {
  728. height:100%;
  729. line-height:22px;
  730. float: left;
  731. clear: left;
  732. width: 320px;
  733. text-transform:uppercase;
  734. list-style-type: none;
  735. }
  736.  
  737. .sidebox ul li a:link, .sidebox ul li a:visited {
  738. background:#E8FDA5;
  739. color:#000;
  740. border-bottom:1px solid #eee;
  741. text-decoration: none;
  742. padding: 5px 0px 5px 10px;
  743. display:block;
  744.  
  745. }
  746.  
  747. .sidebox ul li a:hover {
  748.  
  749. color: #000;
  750. font-weight:bold;
  751. }
  752.  
  753. .sidebox p {
  754. padding: 7px 10px;
  755. margin:0;
  756. }
  757.  
  758. .sidebox table {
  759. width:100%;
  760. text-align:center;
  761. color:#fff;
  762. }
  763.  
  764. .rsswidget {
  765. color: #fff;
  766. }
  767. .rsswidget:hover{
  768. color: #E8FDA5;
  769. }
  770. .rss-tag-icon {
  771. margin-left: 10px;
  772. width: 40px;
  773. height: 40px;
  774. background: url(images/RSS.png) no-repeat;
  775. float:left;
  776. }
  777.  
  778. #recentcomments li {
  779. margin-top: 5px;
  780. padding-left: 10px;
  781. }
  782.  
  783. .tag {
  784. margin-top:5px;
  785. }
  786.  
  787. /*calendar*/
  788.  
  789. #wp-calendar{
  790. width: 100%;
  791. padding: 0 0 15px;
  792.  
  793. }
  794.  
  795. #wp-calendar caption{
  796. padding: 5px 5px ;
  797. font-size:16px;
  798. color:#4A4A49;
  799. }
  800.  
  801. #wp-calendar th, #wp-calendar td{
  802. padding: 5px;
  803. text-align:center;
  804.  
  805. color:#252525;
  806. }
  807.  
  808. #wp-calendar td a{
  809. background:#fff;
  810. padding: 5px 0px;
  811. }
  812. #wp-calendar td a:hover{
  813. color:#3172B4;
  814.  
  815. }
  816. #wp-calendar td{
  817. background:transparent;
  818. }
  819. #wp-calendar td, table#wp-calendar th{
  820. padding: 2px 0;
  821. }
  822.  
  823. /* --- FOOTER --- */
  824.  
  825. #footer {
  826. height:50px;
  827. padding:10px 0 0 0px;
  828. color:#fff;
  829. font-size:11px;
  830. font-family: Tahoma,georgia,Century gothic, Arial, sans-serif;
  831. float:left;
  832. width:100%;
  833. background:#9A9B24;
  834. text-align:center;
  835. line-height:18px;
  836.  
  837. }
  838.  
  839. #footer a:link , #footer a:visited{
  840. color:#eee;
  841. }
  842.  
  843. #footer a:hover {
  844. color:#fff;
  845. }
  846.  
  847. .fright{
  848. float:left;
  849. padding: 0 15px 0 25px;
  850. line-height:30px;
  851. text-align:right;
  852. margin-left:10px;
  853. background:url(images/feed.png) no-repeat;
  854. }
  855.  
  856.  
  857. /* The Navigation */
  858.  
  859. #navigation{
  860. width:600px;
  861. margin:0px auto;
  862. padding:0px 15px 10px 0px;
  863.  
  864. }
  865.  
  866.  
  867. /* The Attachment */
  868.  
  869. .contentCenter {
  870. text-align:center;
  871. }
  872.  
  873.  
  874. /* Tabber */
  875.  
  876.  
  877. ul.tabnav{
  878.  
  879. padding:4px 0px 0px 5px;
  880. height:27px;
  881. margin:0px 0px;
  882. background: #3e1710;
  883. }
  884.  
  885.  
  886. .tabnav li {
  887. display: inline;
  888. list-style: none;
  889. float:left;
  890. text-align:center;
  891. margin-right:5px;
  892. margin-left:8px;
  893. }
  894.  
  895.  
  896. .tabnav li a {
  897. text-decoration: none;
  898. text-transform: uppercase;
  899. padding: 5px 20px;
  900. width:50px;
  901. font-weight:bold;
  902. font: 12px tahoma, helvetica,arial,sans-serif;
  903. color: #fff;
  904. display:block;
  905. background:#3e1710;
  906.  
  907. }
  908.  
  909. .tabnav li a:hover, .tabnav li a:active, .tabnav li.ui-tabs-selected a {
  910. text-decoration:none;
  911. background: #c75e3e;
  912. font-weight:bold;
  913. color: #fff;
  914. }
  915.  
  916.  
  917. .tabdiv {
  918.  
  919. padding: 5px 5px 5px 5px;
  920. font-family:Tahoma,Century gothic, Arial, sans-serif;
  921. background:#d5c488;
  922. margin-bottom: 10px;
  923. }
  924. .tabdiv a:link,.tabdiv a:visited {
  925.  
  926. color:#333;
  927.  
  928. }
  929. .tabdiv a:hover{
  930.  
  931. color: #2676A1;
  932. }
  933. .tabdiv ul{
  934.  
  935. list-style-type:none;
  936. margin:0px 0px;
  937. padding:0px 0px;
  938.  
  939. }
  940.  
  941. .tabdiv ul li{
  942.  
  943. height:100%;
  944. line-height:28px;
  945. padding: 0px 0px 0px 0px;
  946. color:#333;
  947.  
  948. }
  949. .tabdiv li a:link,.tabdiv li a:visited{
  950. display:block;
  951. margin-left:5px;
  952. overflow:hidden;
  953. line-height:24px;
  954. padding:2px 5px ;
  955. margin:2px 0px;
  956. color:#222;
  957. font-size:13px;
  958. border-bottom:1px dotted #fff;
  959.  
  960. }
  961.  
  962. .tabdiv li a:hover {
  963.  
  964. color: #222;
  965. text-decoration:none;
  966. }
  967. .ui-tabs-hide {
  968. display: none;
  969. }
  970.  
  971. .subsbutton {
  972.  
  973. float:left;
  974. margin-left:5px;
  975. margin-bottom:10px;
  976. margin-top: 2px;
  977.  
  978. }
  979.  
  980.  
  981.  
  982. /* sponsors */
  983. .squarebanner {
  984. float:right;
  985. width:320px;
  986. padding-top:0px;
  987. margin:0px 0px 10px 0px;
  988. background:#d5c488;
  989. display:inline;
  990. overflow:hidden;
  991. border: 2px solid #d5bf72;
  992. }
  993.  
  994. .squarebanner ul{
  995. list-style-type:none;
  996. margin: 0px 0px 10px 0px;
  997. padding: 0px 0px 0px 0px;
  998. width:330px;
  999. }
  1000.  
  1001. .squarebanner ul li{
  1002. list-style-type:none;
  1003. margin: 7px 0px 7px 12px;
  1004. padding:8px;
  1005. background:#938172;
  1006. float:left;
  1007. display:inline;
  1008. }
  1009. .squarebanner ul li a img{
  1010. display:block;
  1011. border:none;
  1012. }
  1013.  
  1014.  
  1015. /* The Page Title */
  1016.  
  1017. h2.pagetitle {
  1018. padding:5px 5px;
  1019. margin:0px 0 10px 5px;
  1020. font-size:16px;
  1021. text-align:center;
  1022. color:#000;
  1023.  
  1024. font-family:Georgia,Century gothic,Arial, Helvetica, sans-serif;
  1025. }
  1026.  
  1027.  
  1028. #comment{
  1029.  
  1030. height:100%;
  1031. padding:0px 0px;
  1032. margin:0px 0px;
  1033. }
  1034.  
  1035. h3#comments {
  1036. padding:5px 10px;
  1037. margin:10px 0px;
  1038. border:1px solid #4d1b11;
  1039. font-size:20px;
  1040. font-weight:normal;
  1041. color:#fff;
  1042. background:#541f14;
  1043. font-family:Tahoma,Georgia,Century gothic,Arial, Helvetica, sans-serif;
  1044.  
  1045. }
  1046.  
  1047. #respond{
  1048.  
  1049. height:100%;
  1050. width:630px;
  1051. padding:0px 5px;
  1052. margin:0px 5px 0px 0px;
  1053. background:#541f14;
  1054. border:1px solid #aaa;
  1055.  
  1056. }
  1057. #respond h3{
  1058. padding:5px 10px 5px 10px;
  1059. margin:10px 0px;
  1060. font-size:22px;
  1061. font-weight:normal;
  1062. color:#fff;
  1063. font-family:Georgia,Century gothic,Arial, Helvetica, sans-serif;
  1064. }
  1065. #commentform {
  1066. padding:0px 10px 10px 10px;
  1067. margin:0px 0px 0px 0px;
  1068. color:#BFAFA7;
  1069. font-family:tahoma,Century gothic,Arial, Helvetica, sans-serif;
  1070. }
  1071.  
  1072. #commentform p {
  1073. color:#eee;
  1074. padding:5px 0px;
  1075. font-size:10px;
  1076. }
  1077.  
  1078. #commentform p a{
  1079. color:#fff;
  1080. padding:5px 0px;
  1081. font-size:10px;
  1082. }
  1083.  
  1084. #commentform input {
  1085. background:#fff;
  1086. border:1px solid #ddd;
  1087. color:#444;
  1088. padding-left:10px;
  1089.  
  1090. }
  1091. #commentform textarea {
  1092. background:#fff;
  1093. border:1px solid #ddd;
  1094. color:#444;
  1095. width:95%;
  1096. padding:5px 5px;
  1097.  
  1098. }
  1099. .comments input#submit {
  1100.  
  1101. width:auto;
  1102. line-height:25px;
  1103. padding:3px 5px;
  1104. background:#c75e3e;
  1105. border:2px solid #5f271d;
  1106. color:#fff;
  1107. font-family:tahoma,Century gothic,Arial, Helvetica, sans-serif;
  1108. }
  1109.  
  1110. ol.commentlist {
  1111. list-style:none;
  1112. margin:0;
  1113. padding:0;
  1114. text-indent:0;
  1115. }
  1116.  
  1117. ol.commentlist li {
  1118. border:1px solid #cfbd80;
  1119. margin:0 0 10px;
  1120. padding:5px 7px 5px 57px;
  1121. position:relative;
  1122. }
  1123.  
  1124. ol.commentlist li div.comment-author {
  1125. padding:0 170px 0 0;
  1126. }
  1127. ol.commentlist li div.vcard {
  1128. font:20px Georgia, helvetica,arial,sans-serif;
  1129. padding:5px 0px;
  1130. }
  1131.  
  1132. ol.commentlist li div.vcard cite.fn {
  1133. font-style:normal;
  1134. }
  1135. ol.commentlist li div.vcard cite.fn a.url {
  1136. color:#c00;
  1137. text-decoration:none;
  1138. }
  1139. ol.commentlist li div.vcard cite.fn a.url:hover { color:#000;
  1140. }
  1141.  
  1142. ol.commentlist li div.vcard img.avatar {
  1143. border:5px solid #ddd;
  1144. left:7px;
  1145. position:absolute;
  1146. top:7px;
  1147. }
  1148.  
  1149. ol.commentlist li div.comment-meta {
  1150. font:12px Tahoma, helvetica,arial,sans-serif;
  1151. position:absolute;
  1152. right:10px;
  1153. text-align:right;
  1154. top:5px;
  1155. }
  1156.  
  1157. ol.commentlist li div.comment-meta a {
  1158. color:#000;
  1159. text-decoration:none;
  1160. }
  1161.  
  1162. ol.commentlist li div.comment-meta a:hover {
  1163. color:#000;
  1164. }
  1165. ol.commentlist li p {
  1166. font:normal 12px Tahoma, helvetica,arial,sans-serif;
  1167. margin:0 0 1em;
  1168. line-height:18px;
  1169.  
  1170. }
  1171.  
  1172. ol.commentlist li ul {
  1173. font:normal 12px/1.4 helvetica,arial,sans-serif;
  1174. list-style:square;
  1175. margin:0 0 1em;
  1176. padding:0;
  1177. text-indent:0;
  1178.  
  1179. }
  1180.  
  1181. ol.commentlist li div.reply {
  1182. background:#3e1710;
  1183. border:2px solid #4a1910;
  1184. color:#fff;
  1185. font:bold 9px/1 Tahoma, Georgia,arial,sans-serif;
  1186. padding:5px 10px;
  1187. text-align:center;
  1188. width:36px;
  1189. }
  1190.  
  1191. ol.commentlist li div.reply a {
  1192. color:#eee;
  1193. text-decoration:none;
  1194. text-transform:uppercase;
  1195. }
  1196.  
  1197. ol.commentlist li ul.children {
  1198. list-style:none;
  1199. margin:1em 0 0;
  1200. text-indent:0;
  1201. }
  1202.  
  1203. ol.commentlist li ul.children li.depth-2 {
  1204. margin:0 0 .25em;
  1205. }
  1206.  
  1207. ol.commentlist li ul.children li.depth-3 {
  1208. margin:0 0 .25em;
  1209. }
  1210.  
  1211. ol.commentlist li ul.children li.depth-4 {
  1212. margin:0 0 .25em;
  1213. }
  1214.  
  1215. ol.commentlist li.even {
  1216. background:#e3d5a6;
  1217. }
  1218.  
  1219. ol.commentlist li.odd {
  1220. background:#e3d5a6;
  1221. }
  1222.  
  1223. ol.commentlist li.pingback div.vcard {
  1224. padding:0 170px 0 0;
  1225. }

Autres pages sur : resolu probleme prog debutant php css

a c 232 L Programmation
19 Juin 2011 10:01:16

Salut,

Ils s'entassent sur la gauche parce que tu les as en float:left, et un article sur deux est séparé par un div qui clear le float
m
0
l
19 Juin 2011 15:11:07

Merci beaucoup ! C'est exactement ce qui clochait

Merci beaucoup OMAR !
m
0
l
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS