- Home
- Categorie
- Coding e Sistemistica
- HTML e CSS
- modifica lunghezza pagina
-
modifica lunghezza pagina
ciao a tutti ho il seguente problema: su una pagina che conteneva un testo ho sostituito quel testo con un altro molto più breve. La pagina però è rimasta lunga come prima ed il footer è giù in fondo. Ho provato a modificare la lunghezza nel file css ma non cambia nulla e non riesco proprio a capire cosa devo modificare per chiudere la pagina dove finisce il testo e non 100 metri più in basso
Grazie a chi mi volesse dare una mano
-
Ciao Gabriele,
Puoi per favore darci un'esempio del CSS associato al footer? Magari posta il tuo sito, se non è in locale.In generale, però, un footer fisso in basso allo schermo va sempre bene! (non sto questionando le tue scelte, posta il codice e vedremo se riusciremo a metterlo subito sotto i contenuti
-
Ciao Meis, guarda la pagina modificata è in locale, ad ogni modo per vedere quella originale puoi andare a hoxprestiti.it/glossario.html qui in calce ti metto i fogli di stile css associati alla pagina in questione: i primi due sono generali, il terzo è specifico della pagina. nel primo ci sono le regole sul footer, nel secondo sul breadcrumb che è appena sopra il footer.
html {margin: 0; padding: 0; background-color: transparent; background-image: url('bg.jpg'); background-position: left top; background-repeat: repeat-x; background-attachment: scroll;}body {margin: 0px 0 0px; padding: 0; text-align: left;}
#imPage {padding-top: 34px; margin: 0 auto; width: 960px; position: relative;}
#imHeader {height: 132px; background-color: transparent; background-image: url('top.png'); background-position: top left; background-repeat: no-repeat;}
#imMnMn {position: absolute; top: 0; left: 0; height: 28px; width: 954px; padding: 3px 3px 3px 3px; background-color: transparent; background-image: url('menu.jpg'); background-position: left top; background-repeat: repeat-y;}
li {display: inline}
#imContent {min-height: 380px; position: relative; width: 954px; padding: 3px 3px 3px 8px; }
#imContentGraphics {min-height: 380px; position: absolute; top: 166px; bottom: 0; left: 0; width: 960px; background-color: transparent; background-image: url('content.jpg'); background-position: right top; background-repeat: repeat-y;}
#imFooterBg {clear: both; bottom: 0; width: 100%; background-color: transparent;}
#imFooter {position: relative; margin: 0 auto; height: 128px; width: 960px; background-color: transparent; background-image: url('bottom.png'); background-position: top left; background-repeat: no-repeat;}.imClear{visibility:hidden;clear:both;border:0;margin:0;padding:0;}
.imHidden{display:none;}
.imCaptFrame{vertical-align:middle;}
.imAlertMsg{padding:10px;font:10pt "Trebuchet MS";text-align:center;color:#000;background-color:#fff;border:1px solid;}
h2#imPgTitle, h2#imPgTitle a{padding-top:2px;padding-bottom:2px;margin:5px 0;font:normal normal bold 11.3pt Tahoma;color:#C00000;background-color:transparent;text-align:left;text-decoration:none;}
h2#imPgTitle.imTitleMargin{margin-left:6px;margin-right:6px;}
.imBreadcrumb, .imBreadcrumb a, #imBreadcrumb, a{padding-top:2px;padding-bottom:2px;font:normal normal bold 6.8pt 'Arial Narrow';color:#808080;background-color:transparent;text-align:left;text-decoration:none;}
.imBreadcrumb a, .imBreadcrumb a:link, .imBReadcrumb a:hover, .imBreadcrumb a:visited, .imBreadcrumb a:active{color:#808080;}
{font:normal normal normal 10.0pt Tahoma;color:#000080;background-color:transparent;text-align:left;text-decoration:none;;}
a.imCssLink:link, .imCssLink{background-color:transparent;color:#C00000;text-decoration:none;}
a.imCssLink:visited{background-color:transparent;color:#C04000;text-decoration:none;}
a.imCssLink:hover, a.imCssLink:active, .imCssLink:hover, .imCssLink:active{background-color:transparent;color:#C00000;text-decoration:underline;}
a.imAbbr:link{background-color:transparent;color:#C00000;text-decoration:none;}
a.imAbbr:visited{background-color:transparent;color:#C04000;text-decoration:none;}
a.imAbbr:hover, a.imAbbr:active{background-color:transparent;color:#C00000;border-bottom:1px dotted #C00000;text-decoration:none;}
#imBtMn{margin-left:6px;margin-right:6px;padding:2px 0;position:relative;clear:both;border-top:1px solid;border-bottom:1px solid;}
, a, a:visited, a:hover, a:active{font:normal normal bold 10.0pt Tahoma;color:#000080;background-color:transparent;text-align:center;text-decoration:none;}
a:hover{text-decoration:underline;}
a{border:none;}
div#imSB{z-index:10300;position:fixed;width:100px;height:100px;display:block;background-color:#FFFFFF;background-position:center;background-repeat:no-repeat;border:1px solid #000000;}
#imSBBG{z-index:10290;}
div#imSB div#imSBmedia{overflow:hidden;text-align:center;position:relative;margin-left:auto;margin-right:auto;}
div#imDes{padding:5px 0 0 0;text-align:left;font:normal normal normal 9.0pt Tahoma;color:#000000;background-color:#FFFFFF;text-align:left;text-decoration:none;}
div#imClose{position:absolute;top:-13px;right:-13px;cursor:pointer;}
div#imClose img{width:20px;}
div#imNext,div#imPrev{position:absolute;width:35px;background-color:#FFFFFF;line-height:30px;cursor:pointer;font:bold 30px Trebuchet MS;text-align:center;color:#000000;background-repeat:no-repeat;background-position:center;}
.imTip{z-index:100201;background-color:#FFFFE1;border:1px solid;font:normal normal normal 9.0pt Tahoma;color:#000000;background-color:#FFFFE1;text-align:left;text-decoration:none;margin:0 auto;padding:10px;position:absolute;}
.imTipArrowBorder{border-color:#000000;border-style:solid;border-width:10px;height:0;width:0;position:absolute;}
.imTipArrow{border-color:#FFFFE1;border-style:solid;border-width:10px;height:0;width:0;position:absolute;}
.imReverseArrow{border-color:transparent transparent transparent;border-style:solid;border-width:10px;height:0;width:0;position:absolute;top:-20px;left:30px;}
.imTip img{margin-bottom:6px;}
#imDatePicker{position:absolute;width:230px;padding:5px;background-color:white;font-family:Arial;border:1px solid #888;}
table{border-collapse:collapse;margin-left:auto;margin-right:auto;}
#imDPHead{padding:10px;line-height:20px;height:20px;display:block;text-align:center;border:1px solid #aaaaaa;background-color:#c1cbd5;}
#imDPMonth{text-align:center;padding:3px 30px 3px 30px;font-size:12px;font-weight:bold;}
.day{background-color:#fff;text-align:center;border:1px solid #aaa;vertical-align:middle;width:30px;height:20px;font-size:10px;cursor:pointer;}
.selDay{background-color:rgb(255,240,128);}
.day:hover{background:#fff;}
td.imDPhead{cursor:default;font-size:12px;text-align:center;height:25px;vertical-align:middle;}
#imDPleft, #imDPright{display:inline;cursor:pointer;font-weight:bold;}
#imGuiPopUp{padding:10px;position:fixed;background-color:#FFFFFF;border:1px solid;font:normal normal normal 9.0pt Tahoma;color:#000000;background-color:#FFFFFF;text-align:left;text-decoration:none;;}
.imGuiButton{margin-top:20px;margin-left:auto;margin-right:auto;text-align:center;width:80px;cursor:pointer;background-color:#444;color:white;padding:5px;font-size:14px;font-family:Arial;}
#imGuiPopUpBg{position:fixed;top:0px;left:0px;background-color:#000000;}
.imHTMLObject{line-height:20px;}
#imWebSiteX5Adv{position:absolute;top:0;right:0;z-index:1500;overflow:hidden;}
#imWebSiteX5AdvObj{position:relative;}
#imLogin{width:250px;margin:0 auto;}
.imLoginBlock{margin-bottom:10px;}
#imUname, #imPwd{width:100%;border:1px solid black;background-color:white;}
#imLoginDescription{margin:0 5px 20px 5px;}
#imLoginError{color:red;}
#welcome-flags{margin:0 auto;text-align:center;}
div{display:inline;margin:10px;}
#imCartContainer{width:100%;float:left;text-align:left;padding:0 0 30px 0;}
p{margin:30px 8px 15px 8px;}
#imCartProductsTable{width:90%;margin:0 auto;}
#imCartShippingsTable, #imCartPaymentsTable{margin-left:5%;width:70%;}
,,{border-collapse:collapse;}
caption, caption, caption{font-weight:bold;text-align:left;padding:0 0 5px 5px;}
#imCartTotalPriceCont{display:inline;padding:5px;margin-top:20px;margin-right:5%;float:right;font-weight:bold;color:#000000;background-color:#C0C0C0;border:1px solid #808080;}
#currencyConvResult{display:inline;margin-left:5px;}
.imCartHeader td, .imCartHeader td, .imCartHeader td, #imCartButtonBack, #imCartButtonNext, #imCartUserFormSubmit, #imCartButtonEmpty{background-color:#C0C0C0;color:#000000;}
,,,{font-family:Tahoma;font-size:10.000pt;font-weight:normal;font-style:normal;border:1px solid;cursor:pointer;}
td, td, td{background-color:transparent;color:#000000;padding:5px;border:1px solid;}
td.nostyle, td.nostyle, td.nostyle{background-color:transparent;color:#000080;padding:5px;border:none;}
td input, td input, td input{height:15px;}
.imCartLabel span{line-height:22px;display:block;float:left;width:40%;text-align:right;margin-right:10px;}
.imCartLabelLeft span{line-height:22px;display:block;float:left;width:100%;text-align:left;margin-right:10px;}
.imCartInput{background-color:transparent;font:normal normal normal 10.0pt Tahoma;color:#000000;text-align:left;text-decoration:none;padding:2px;width:30%;border:1px solid;}
#imCartAgreementText{margin-top:15px;background-color:transparent;width:50%;margin:0 auto;}
#imCartAgreementText_div{font:normal normal normal 10.0pt Tahoma;color:#000080;text-align:left;text-decoration:none;width:100%;text-align:left;border:none;padding:2px;}
#imCartAcceptContainer{width:100%;text-align:right;}
*{float:left;}
.valDisclaimer{background-color:transparent;}
.imCartFormRow{margin:3px;}
#imCartOrderNumber{width:250px;padding:10px;font-weight:bold;margin:10px auto;text-align:center;background-color:#C0C0C0;color:#000000;border:1px solid;}
h2#imPgTitle.searchPageTitle{float:left;margin-left:10px;width:98%;}
.searchPageContainer{padding:10px;}
#imSearchSideBar{width:14%;padding:20px 0;}
#imSearchContent{width:85%;padding:20px 0;}
.imSLabel{padding:10px 0;}
ul{border:0px solid #A9A9A9;}
li{display:block;margin-bottom:0px;background-color:#8EA4E0;width:100%;border-bottom:1px solid;}
li.imPgMnFirst{border:none;}
.imScMnTxt{display:block;padding:6px 3px;text-decoration:none;font:normal bold 9.750pt Eurostile;color:#000080;}
li:hover{background-color:#C0C0FF;cursor:pointer;}
li:hover a, li:hover .imScMnTxt{cursor:pointer;text-decoration:none;color:#C00000;font-style:normal;font-weight:normal;}
.imScMnTxt a{display:block;width:100%;}
li.imPgMnSeparator a, li.imPgMnSeparator .imScMnTxt, li:hover.imPgMnSeparator a, li.imPgMnSeparator .imScMnTxt{cursor:auto;background-color:#8EA4E0;text-decoration:none;color:#000080;font-style:normal;font-weight:bold;}
li:hover.imPgMnSeparator{cursor:auto;background-color:#8EA4E0;}
ul a, ul a:hover, ul a:visited{font:inherit;color:inherit;text-align:inherit;text-decoration:none;}
.imPageSearchField{text-align:center;}
.imPageSearchField .search_field{border:1px solid black;background-color:white;font:inherit;}
.imSearchLink{margin-top:5px;}
.imSearchPageResult, .imSearchBlogResult, .imSearchProductResult{padding:0 0 20px 0;}
#imSearchResults .imSearchCount{text-decoration:none;font-weight:normal;}
h3{color:inherit;margin-bottom:5px;font-size:1.2em;text-decoration:underline;font-weight:normal;}
h3 a, h3 a:hover, h3 a:visited{color:inherit;}
.imProductListImage{float:left;}
.imProductListImage img{width:100px;padding:0 10px 10px 0;}
.imSearchProductDescription{width:90%;float:left;}
.imSearchProductPrice{width:9%;float:right;}
.imSearchImageResultContent{float:left;width:50%;}
.imSearchImageResult{clear:none;float:left;width:50%}
.imSearchImageResult img{border-width:0;width:94%;padding-left:3%;padding-right:3%;float:left;}
.imSearchVideoResultContent{float:left;width:50%;}
.imSearchVideoResult{clear:none;float:left;width:50%}
.imSearchVideoResult img{border-width:0;width:94%;padding-left:3%;padding-right:3%;float:left;}
.imSearchVideoDuration{margin-top:5px;clear:both;display:block;text-decoration:none;color:gray;font-weight:normal;}
ul.imSiteMap li{padding:5px 0 5px 20px;}
ul.imSiteMap li img{vertical-align:text-bottom;}
.imBlogCommentsForm{text-align:left;}
.imBlogCommentsCount{font-weight:bold;margin:10px 0 7px;}
.imBlogPostCommentUser{margin-bottom:5px;font-weight:bold;}
.imBlogPostAbuse{margin:5px 0 5px 0;border-bottom:1px dotted #604924;padding:0 0 5px 0;}
.imBlogPostCommentDate{margin:3px 0 5px 0;}
.imCaptFrame{position:absolute;float:right;margin:0;padding:0;top:5px;}
.imBlogCommentRow{position:relative;clear:both;padding-top:5px;}
.imBlogCommentRow input.imfield, .imBlogCommentRow textarea{border:1px solid black;background-color:white;}
.imBlogCommentSubmitBtn{margin:0 auto;height:21px;font:11px Tahoma;color:#000000;background-color:#D3D3D3;padding:3px 6px 3px 6px;border:1px solid;vertical-align:middle;cursor:pointer;}questo di seguito è il foglio di stile associato alla pagina specifica
h2#imPgTitle {float: left; margin-left: 6px; margin-right: 6px; width: 768px;}
{float: left; margin-left: 6px; margin-right: 6px; width: 768px;}
#imCell_1 { display: block; position: relative; overflow: hidden; width: 770px; min-height: 4660px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid transparent; border-right: 5px solid transparent;}
#imCellStyle_1 { position: relative; width: 770px; min-height: 4660px; padding: 0px 0px 0px 0px; text-align: center; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; z-index: 2;}
#imCellStyleGraphics_1 { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: transparent;}
#imTextObject_1 { line-height: 1px; font-size: 1pt; font-style: normal; color: black; font-weight: normal; }
a { color: inherit; }
ul { list-style: disc; margin: 0px; padding: 0px; }
ul li { margin: 0px 0px 0px 15px; padding: 0px; font-size: 9pt; line-height: 19px;}
table { margin: 0 auto; padding: 0; border-collapse: collapse; border-spacing:0; line-height: inherit; }
table td { padding: 4px 3px 4px 3px; margin: 0px; line-height: 1px; font-size: 1pt; }
p { margin: 0; padding: 0; }
img { border: none; margin: 0px 0px; vertical-align: text-bottom;}
img.fleft { float: left; margin-right: 15px; vertical-align: baseline;}
img.fright { float: right; margin-left: 15px; vertical-align: baseline;}
.imUl { text-decoration: underline; }
.ff0 { font-family: "Tahoma"; }
.ff1 { font-family: "Symbol"; }
.ff2 { font-family: "Tahoma"; }
.ff3 { font-family: "Wingdings"; }
.cf1 { color: #000080; }
.cf2 { color: #FFFFFF; }
.cf3 { color:; }
.cf4 { color:; }
.cf5 { color:; }
.fs20 { vertical-align: baseline; font-size: 10pt; line-height: 20px; }
.cb1 { background-color:; }
.cb2 { background-color: transparent; }
.cb3 { background-color:; }
.cb4 { background-color:; }
.cb5 { background-color:; }
#imCell_2 { display: block; position: relative; overflow: hidden; width: 770px; min-height: 171px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid transparent; border-right: 5px solid transparent;}
#imCellStyle_2 { position: relative; width: 770px; min-height: 171px; padding: 0px 0px 0px 0px; text-align: center; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; z-index: 2;}
#imCellStyleGraphics_2 { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: transparent;}
-
Da glossario.css, riga 3:
*#imCell_1 { display: block; position: relative; overflow: hidden; width: 770px; min-height: 4660px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid transparent; border-right: 5px solid transparent;} **#imCellStyle_1 { position: relative; width: 770px; min-height: 4660px; padding: 0px 0px 0px 0px; text-align: center; border-top: 0; border-bottom: 0; border-left: 0; border-right: 0; z-index: 2;}*
Vedi quel min-height? È l'altezza minima che tiene quel div
-
Quella è proprio la modifica che sono andato a fare per vedere se mi si accorciava la pagina ma ho provato a ridurla (ho provato con diverse altezze) ma la pagina è rimasta uguale. Per questo non so cosa fare: tra i vari tentativi mi pare anche di aver provato a dargli un min-height in percentuale ma il risultato è che non cambia nulla.
-
Oltre a quelli, alla riga 640 del glossario.html ho trovato:
<div id="imPgMn" style="min-height: 4851px;">
-
Meis, grandissimo! grazie mille: cambiando tutti i valori sia sull'html che sul foglio di stile è andato tutto a posto. Mi hai veramente aiutato a risolvere un problema su cui mi ero incancrenito e non riuscivo più a venirne a capo. Grazie ancora.
-
Figurati!
Il caso è chiuso xD