|
| Thread Tools | Display Modes |
|
#1 ()
|
|||
|
|||
Background-image-Verwendung
Hello zXmX, has there a problem with my (future) homepage, on which I have found immernoch no solution. Namely I have a background image, which runs through from the Header up to the Footer (repeat y). Nevertheless, funny enough the length is not determined about the longest Div element in "content", but only about the length from "sidebar" (see code CSS). D.h. if I have long contents in the main window ("main_content"), then he runs through the side out. web address: gidoo.pytalhost.com/index.html (sry for advertisement).
> the side is checked W3C (XHtml & CSS) Easiest is to be controlled the page by means of developer tools (opuses Dragonfly and Firefox 'something'...) and I already thanks all for an answer has broken to me quite for hours the head muster.org homepage The file CSS (has also shortened here). /*Allgemeine width */.width { display: perch; width: 1180px; margin: 0 auto; }.width30 { width: 20%; }.width70 { width: 77%; } /* main window */ #content { position: relative ones; height: auto! important; min height: 95 %; height: 100%; }.background { background: url (../images/bg/page.gif) repeat y top centre; background position: 48 % 0; } /*Unterteilung of the side in two columns (OBEN&UNTEN!) */ #content_left { display: inline perch; width: 289px; margin: 0; padding: 0; } #content_right { display: inline perch; width: 784px; margin: 0; padding: 0; } /*Rechte column ON TOP (Header picture, RSS Feed, Logo*/ #header_right { position: absolute ones; top: 0px; width: 784px; height: 306px; margin: 0; padding: 0; } /*RSS Feed begin*/ #rssFeed { margin: 0 0 0 4px; padding: 0; text align: left; width: 711px; height: 65px; float: left; background: url (../images/bg/header.gif) repeat x top right; colour: #faa24b; } #rssFeed a { colour: #faa24b; text decoration: none; border: 0; } #rss_pic { position: relative ones; left: 9pt; top: 4pt; height: 50px; border: 0; }.rss_abo { position: relative ones; left: 14pt; top: 7pt; font: 14pt Verdana,Helvetica,Arial,sans serif; text decoration:none; }.clearbox { display: perch; height: 0; clear: both; } /*RSS Feed end*/ /*logo here www.gidoo.ch*/ #logo { position: relative ones; top: 27pt; float: right; width: 260px; font: 20pt Verdana,Helvetica,Arial,sans serif; colour: #fff; } /*usw...*/ /*Linke column ON TOP (Hauptmenu) */ /*Hauptmenu begin*/ #mainmenu { text align: left; background colour: #5b5b5b; display: inline perch; margin: 0; width: 289px; height: 371px; vertical align: top; } /*usw...*/ /*here == actively element for hover Effekt*/ #mainmenu ul li a:hover,#mainmenu ul li a.here { height: 58px; background: #0d0d0d; border top: 7px solidly #b10011; } /*usw...*/ /*Hauptmenu end*/ /*Linke column BELOW (Sidebar with Untermenu) begin*/ #sidebar_left { font: 16pt Verdana,Helvetica,Arial,sans serif; text align: left; margin:0; width: 289px; } /*usw...*/ /*LINKE column end*/ /*RECHTE column BELOW (contents the page) begin*/ #main_content { display: inline perch; padding: 5px 5px 5px 20px; position: absolute ones; top: 400px; vertical align: top; width:665px; height: 100%; } /*RECHTE column end*/ /*Footer (Login/copyright) begin*/ #footer { background: url (../images/bg/footer.gif) no repeat top centre; height: 58px; background position: 48 % 0; font: 10pt Verdana,Helvetica,Arial,sans serif; colour: #fff; } /*usw...*/ /*Footer end*/ Edit: Here one more photo of my problem: gidoo.pytalhost.com/example.jpg |
|
#2 ()
|
|||
|
|||
Background-image-Verwendung
make sometimes for everybody box ramen with more own farbe, then sees at the head it lies. I can well fancy that one of the internal ones box about the external one box runs out. is, unfortunately, with css in such a way.
|
|
#3 ()
|
|||
|
|||
Background-image-Verwendung
Basically runs main_content buck about content box over here out, although it is correctly interlaced hierarchically (content > main_content). But how can one adapt the length content box on that long from main_content? `Or gehts not at all with css
|
|
#4 ()
|
|||
|
|||
Background-image-Verwendung
is in general a little bit irritatingly and tricky. mostly it helps if one in hirachie after the internal ones box simple zeichen places. last element in contenbox it seems should be one stink normal zeichen. mostly this helps.
|
|
| Thread Tools | |
| Display Modes | |
|