Suche
Teilen
startseite » forum

Inhalt von Spalten verschiebt sich

  • venustra venustra
    T3PO
    0 x
    24 Beiträge
    0 Hilfreiche Beiträge
    20. 06. 2011, 15:33

    Hallo Forum,
    ich hab ein ziemlich nerviges Problem. Ich arbeite mit 3 Spalten (Links: Menü; Mitte: Conten und Rechts: Extras wie Aktuelles etc.)
    Nun ist es so seit ich die Breite des Wraps von 760 auf 960 geändert habe spinnt alles, bzw. der Inhalt vom Content spinnt.
    Dort wo der Text länger ist als das Menü reicht geht der Text mitmal weiter nach Links und wenn Rechts etwas steht fängt ein Teil vom Content erst unterhalb des Endes von Rechts an.
    (Ich hoffe Ihr versteht was ich meine, kann im Moment leider keine Bilder hier einfügen.)

    Ich habe z.B. auf der Start Seite das Menü, in der Mitte sind 3 Datensätze (2x Text, 1x Bild) und Rechts sind auch 3 Datensätze (1x Text, 1x Bild und 1x reines html)
    bei diese Zusammenstellung ist es so dass der 3. Datensatz aus der Mitte erst da anfängt wo der 3. Datensatz von Rechts endet.

    Hoffe Ihr könnt mir helfen.

  • 1
  • lisardo lisardo
    Jedi-Meister
    0 x
    306 Beiträge
    0 Hilfreiche Beiträge
    20. 06. 2011, 19:22

    [quote="venustra"]
    Hoffe Ihr könnt mir helfen.
    [/quote]

    Ohne Bilder und ohne Quelltext? Nein.

    Peter, [url=http://www.typo3-lisardo.de]TYPO3 @ lisardo (Augsburg)[/url]

  • venustra venustra
    T3PO
    0 x
    24 Beiträge
    0 Hilfreiche Beiträge
    21. 06. 2011, 08:12

    Ich zeig euch einfach mal alles ^^

    1. body {background:url(img/bg.gif) repeat-y top center #eaeaea; color:#3a3a3a; font:76% Verdana,Tahoma,Arial,sans-serif; margin:0 auto; padding:0;}
    2.  
    3. /* Main layout and header */
    4. #wrap {background:#fff; color:#303030; margin:0 auto; padding:1px 5px; width:960px; height: 890px;}
    5. #header {background:url(img/front.jpg) no-repeat center #fff; color:#505050; height:210px; margin:0 0 10px; padding:0;}
    6. #header h1 {font-size:2.5em; font-weight:400; letter-spacing:-2px; margin:0 0 4px 15px; padding:15px 0 0;}
    7. #header h1 a,#header h1 a:hover {font-weight:400; padding:0;}
    8. #header p {font-size:1.1em; letter-spacing:-1px; margin:0 0 20px 15px; padding:0 0 0 3px;}
    9.  
    10. /* Left sidebar and menu*/
    11. #leftside {clear:left; float:left; margin:0 0 10px; padding:0; width:200px;}
    12. #leftside ul.avmenu {list-style:none; margin:0 0 18px; padding:0; width:200px;}
    13. #leftside ul.avmenu > li {display:inline; padding:0; width:150px;}
    14. #leftside ul.avmenu > li > a {background:url(img/menubg.gif) repeat-x bottom left #f4f4f4; border-bottom:1px solid #d8d8d8; border-left:4px solid #ccc; border-right:1px solid #d8d8d8; border-top:1px solid #d8d8d8; color:#505050; float:left; font-size:1em; font-weight:700; margin-bottom:5px; padding:5px 1px 5px 5px; text-decoration:none; width:138px;}
    15. #leftside ul.avmenu > li > a:hover,#leftside ul.avmenu > li > a.current {background:url(img/menubg2.gif) repeat-x bottom left #eaeaea; border-bottom:1px solid #b0b0b0; border-left:4px solid #505050; border-right:1px solid #b0b0b0; border-top:1px solid #b0b0b0; color:#505050;}
    16.  
    17.  
    18. #leftside ul.avmenu2 li {clear:left; display:inline; padding:0; width:100px; text-align:left;}
    19. #leftside ul.avmenu2 li a {background:color:#ffffff; float:left; border-bottom:5px solid #ffffff; font-size:1em; font-weight:700; width:138px;}
    20. #leftside ul.avmenu2 li a:hover,#leftside ul.avmenu2 li a.current {background:color:#ffffff;}
    21.  
    22.  
    23. #leftside ul.avmenu3 li {clear:left; display:inline; padding:0; width:100px; text-align:left;}
    24. #leftside ul.avmenu3 li a {background:color:#ffffff; float:left; border-bottom:5px solid #ffffff; font-size:0.9em; font-weight:700; width:138px;}
    25. #leftside ul.avmenu3 li a:hover,#leftside ul.avmenu3 li a.current {background:color:#ffffff;}
    26.  
    27.  
    28.  
    29. #leftside ul.avmenu ul {font-size:0.9em; margin:0 0 0 15px; padding:0 0 5px 0; width:133px;}
    30. #leftside ul.avmenu ul a {padding:3px 1px 3px 5px; width:123px;}
    31. #leftside ul.avmenu ul ul {font-size:1em; width:120px;}
    32. #leftside ul.avmenu ul ul a {width:108px;}
    33. #leftside h2 {font-size:1.5em; font-weight:400;}
    34.  
    35. #leftside .announce {background:url(img/menubg.gif) repeat-x bottom left #f4f4f4; border-bottom:1px solid #d8d8d8; border-left:4px solid #ccc; border-right:1px solid #d8d8d8; border-top:1px solid #d8d8d8; clear:left; color:#505050; line-height:1.3em; margin:10px 0; padding:5px 5px 5px; width:134px;}
    36. #leftside p,.announce p {font-size:0.9em;}
    37.  
    38. /* Right sidebar */
    39. #extras {float:right; margin:0 0 10px; padding:0; width:200px;}
    40. #extras p,#extras ul {font-size:0.9em; line-height:1.3em; margin:0 0 1.5em; padding:0;}
    41. #extras li {list-style:none; margin:0 0 6px; padding:0;}
    42. #extras h2 {font-size:1.6em; font-weight:400; letter-spacing:-1px; margin:0 0 6px;}
    43.  
    44.  
    45. /* Main content variations */
    46. #content {min-height: 70%; line-height:1.5em; margin:10px 150px 10px 170px; padding: 0; text-align:left;}
    47. #contentwide {line-height:2em; margin:10px 0 10px 160px; padding:0; text-align:left;}
    48. #content h2,#contentwide h2 {font-size:20; font-weight:400; letter-spacing:-1px; margin:20px 0 10px; padding:0;}
    49. #content h3,#contentwide h3 {font-size:205; font-weight:400; margin:6px 0; padding:0;}
    50. #content img,#contentwide img {background:#ccc; border:10px solid #ffffff; color:#ffffff; display:inline; padding:0; margin:0 10px 5px 0;}
    51. #content ul,#content ol,#contentwide ul,#contentwide ol {margin:0 0 16px 20px; padding:0;}
    52. #content ul ul,#content ol ol,#contentwide ul ul,#contentwide ol ol {margin:2px 0 2px 20px;}
    53. #content li,#contentwide li {margin:0 0 2px 10px; padding:0 0 0 4px;}
    54.  
    55. /* Footer */
    56. #footer {background:#fff; border-top:2px solid #dadada; clear:both; color:gray; font-size:0.9em; margin:0 auto; padding:8px 0; text-align:center; width:960px;}
    57. #footer p {margin:0; padding:0;}
    58. #footer a {background:inherit; color:gray; font-weight:400; text-decoration:none;}
    59. #footer a:hover {text-decoration:underline;}
    60.  
    61. /* Links and paragraphs */
    62. a {background:inherit; color:#303030; text-decoration:none; font-weight:700;}
    63. a:hover {background:inherit; color:#286ea0; text-decoration:underline;}
    64. a img {border:0;}
    65. p {margin:0 0 16px;}
    66. blockquote {background:url(img/menubg.gif) repeat-x bottom left #f4f4f4; border-bottom:1px solid #d8d8d8; border-left:4px solid #ccc; border-right:1px solid #d8d8d8; border-top:1px solid #d8d8d8; color:#505050; margin:16px; padding:7px 7px 7px 11px;}
    67. blockquote p {font-size:1.1em; line-height:1.3em; margin:0;}
    68.  
    69. /* Tables and forms */
    70. table {border:1px solid #d8d8d8; border-collapse:collapse; line-height:1.3em; width:95%; margin:0 0 16px; padding:0;}
    71. caption {font-size:1.5em; font-weight:400; margin:0; padding:6px 0 8px; text-align:left;}
    72. th {background:url(img/menubg2.gif) repeat-x bottom left #eaeaea; color:#505050; padding:7px; text-align:left;}
    73. td {background:url(img/menubg.gif) repeat-x bottom left #f4f4f4; color:#303030; font-size:0.9em; padding:7px; text-align:left;}
    74. input,textarea {border:1px solid #ccc; font-family:Verdana,Tahoma,Arial,Sans-Serif; font-size:1em; margin:5px; padding: 4px; margin-left: 0px;}
    75. label {margin:2px; font-size: 12px; width: 100px; float: left; clear: right;}
    76. input {width:150px;}
    77. textarea {width:300px;}
    78. fieldset {border: 0px;}
    79.  
    80. /* Search box */
    81. #searchbox label,.hide {display:none;}
    82. #searchbox {margin:6px 0 16px; padding:0;}
    83. #searchform {background:#fff; border:1px solid #ccc; color:#505050; font-size:0.9em; padding:4px; width:116px;}
    84.  
    85. /* Various classes */
    86. .announce h2 {margin:0 0 10px; padding:0;}
    87. .textright {margin:-10px 0 4px; text-align:right;}
    88. .center {text-align:center;}
    89. .small {font-size:0.8em;}
    90. .large {font-size:1.3em;}
    91. .highlighted {background:#f0f0f0; border:1px solid #b0b0b0; color:#303030; padding:3px;}
    92. .button {background:url(img/menubg.gif) repeat-x bottom left #f4f4f4; border-bottom:1px solid #d8d8d8; border-left:4px solid #ccc; border-right:1px solid #d8d8d8; border-top:1px solid #d8d8d8; color:#505050; font-weight:700; margin:0 0 15px; padding:7px 7px 7px 11px; width:120px;}
    93. .left {float:left; margin:10px 10px 5px 0;}
    94. .right {float:right; margin:10px 0 5px 10px;}

    2. <!-- ###DOKUMENT### begin -->
    3.  
    4. <div id="wrap">
    5.  
    6.   <div id="header">
    7.       ###TRAILER###
    8.   </div>
    9.  
    10.  
    11.   <div id="leftside">     
    12.       ###MENU_LINKS###    
    13.   </div>
    14.  
    15.  
    16.   <div id="extras">
    17.       ###RECHTS###
    18.   </div>
    19.  
    20.  
    21.   <div id="content">     
    22.       ###MITTE_CONTENT###
    23.   </div>
    24.  
    25.  
    26.   <div id="footer">
    27.       ###FOOTER###
    28.   </div>
    29.  
    30.  
    31. </div>
    32.  
    33.  
    34. <!-- ###DOKUMENT### end -->
    35.  
    36. </body>

    1. config.simulateStaticDocuments_noTypeIfNoTitle = 1
    2. page = PAGE
    3. page.config.disablePrefixComment = true
    4. page.config.removeDefaultJS = external
    5. page {
    6. typeNum = 0
    7. stylesheet = fileadmin/style.css
    8. meta.AUTHOR = Svenja Bruns
    9. meta.DESCRIPTION = SUWE Computer Service GmbH Template  
    11. 10.template = FILE
    12. 10.template.file = fileadmin/index.html
    13. 10.workOnSubpart = DOKUMENT
    14.  
    15. 10.marks{
    16.     TRAILER = TEXT
    17.     TRAILER.value =
    18.  
    19.     MENU_LINKS = HMENU
    20.     MENU_LINKS.special = directory
    21.     MENU_LINKS.special.value = 4
    22.  
    23.  
    24.   MENU_LINKS{
    25. 1 = TMENU
    26.   1.wrap = <ul class="avmenu">|</ul>
    27.   1{
    28.     NO{
    29.       wrapItemAndSub = <li>|</li>
    30.     }
    31.   }
    32.  
    33.  2 = TMENU
    34.   2.wrap = <ul class="avmenu2">|</ul>
    35.   2{
    36.     NO{
    37.       wrapItemAndSub = <li>|</li>
    38.     }  
    39.   }
    40.  
    41.     3 = TMENU
    42.   3.wrap = <ul class="avmenu3">|</ul>
    43.   3{
    44.     NO{
    45.       wrapItemAndSub = <li>|</li>
    46.     }  
    47.   }
    48.  }
    49.  
    50.  MITTE_CONTENT = CONTENT
    51.  MITTE_CONTENT {
    52.  table = tt_content
    53.  select.orderBy = sorting
    54.  select.where = colPos = 0
    55.  }
    56.  
    57.  
    58.   RECHTS = CONTENT
    59.   RECHTS {
    60.   table = tt_content
    61.   select.orderBy = sorting
    62.   select.where = colPos = 2
    63.   }
    64.  
    65.  FOOTER = TEXT
    66.  FOOTER{
    67.  value = (c) copyright by SUWE Computer Service GmbH
    68.  
    69.  }
    70.  
    71.  
    72.  
    73.  }
    74. }

    Da ich mich irgendwie nicht bei flickr anmelden kann zur Zeit, kann ich leider keine Bilder zeigen

  • venustra venustra
    T3PO
    0 x
    24 Beiträge
    0 Hilfreiche Beiträge
    27. 06. 2011, 08:10

    So, jetzt endlich die Bilder zu meinem Problem.
    Ich hoffe ihr könnt mir jetzt helfen.

    [img]http://farm6.static.flickr.com/5266/5875638159_cc6c4e8d80_z.jpg[/img]

    [img]http://farm6.static.flickr.com/5273/5875638089_fa7f368348_b.jpg[/img]

  • 1
Präsentiert von