Viewing Can't get page to center
Can't get page to center
|
User: Jarvis S. 10 years ago
|
|
|
The main page for: n4khq.com https://dl.dropboxusercontent.com/u/10068452/Web/NPete_Dee/index.html will not center. Page layout - Centered Layout was selected by default when the page was created but it was not centered in the browser nor was it centered in EverWeb. I changed it to Left Aligned Layout published changes, changed it back to center layout and published changes. It is showing centered in EverWeb but not centered in any web browser. I have tried different computers. I have published changes 10 times and published entire site 2 times. The other three pages work as expected, I changed one to left, saved and checked, it was left. Changed it back and it centered. What am I doing wrong? Thanks Last edit 10 years ago |
|
|
User: Roddy 10 years ago
|
|
|
You have inserted an HTML doc into the web page. Remove this code and insert it properly by putting the styles into the Head Code box and the HTML into a Snippet. See THIS PAGE for more info. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="nl" lang="nl"> <head> <meta name="viewport" content="width=device-width" /> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title>Pete & Dee Gallery</title> <link rel="shortcut icon" href="/apple-touch-icon.png" /> <style type="text/css"> <!-- html {font-size: 18px; font-family: 'Lucida Sans', sans-serif; width: 427px; height: 285px;} body {padding: 0px; margin: 0px; font-size: .7em;} #defaultDiv {position: absolute; padding: 0px; margin: 0px; overflow: hidden; width: 427px; height: 285px; background: url(http://dl.dropbox.com/u/10068452/Web/Pete_%26_Dee/Gallery/WildCat.jpg) no-repeat top left;} .big {width: 427px; height: 285px; position: absolute; top: 0px; left: 0px; display: none; background-repeat: no-repeat; background-position: center center; z-index: -2;} #th1, #th2, #th3, #th4, #th5, #th6, #th7, #th8, #th9, #th10 {float: left; width: 42px; height: 28px; border-right: 1px dotted #d3d3d3;} #th10 {border-right: none; width: 40px;} #defaultDiv p { font-family : Futura; font-size: 1.5em; color: #551A8B; padding: 5px 0px 0px 0px; width: 427px; height: 30px; position: absolute; bottom: 0px; left: 0px; background-color: #fffff0; text-align: center; opacity: .6; display: none; } #defaultDiv #Show p {display: block;} #defaultDiv:hover {background: none;} #defaultDiv:hover #Show {display: none;} #th1:hover .big, #th2:hover .big, #th3:hover .big, #th4:hover .big, #th5:hover .big, #th6:hover .big, #th7:hover .big, #th8:hover .big, #th9:hover .big, #th10:hover .big {display: block;} #th1 a, #th2 a, #th3 a, #th4 a, #th5 a, #th6 a, #th7 a, #th8 a, #th9 a, #th10 a {position: absolute; top: 0px; height: 100%; width: 10%;} #th1:hover p, #th2:hover p, #th3:hover p, #th4:hover p, #th5:hover p, #th6:hover p, #th7:hover p, #th8:hover p, #th9:hover p, #th10:hover p {display: block; z-index: -1;} --> </style> </head> <body> <div id="defaultDiv"> <div id="Show"><p>Mouse Over and Click</p></div> <div id="th1"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/NPete_Dee/Gallery/Balsam.jpg);"></div> <p>Balsam Mountain</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157626945201423/"></a> </div> <div id="th2"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Buck.jpg);"></div> <p>Cades Cove</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627072320048/"></a> </div> <div id="th3"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Buton.jpg);"></div> <p>Lake Burton</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157612010423497/"></a> </div> <div id="th4"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/CadesCove.jpg);"></div> <p>Cades Cove</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627072320048/"></a> </div> <div id="th5"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/Pete_%26_Dee/Gallery/Cloudland.jpg);"></div> <p>Cloudland</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627069242300/"></a> </div> <div id="th6"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Hurricane.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> <div id="th7"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Oceana.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> <div id="th8"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Okefnokee.jpg);"></div> <p>Okefenokee Swamp</p> <a href="https://www.flickr.com/photos/11196422@N06/albums/72157628266672801/"></a> </div> <div id="th9"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/PortaBoat.jpg);"></div> <p>Okefenokee Swamp</p> <a href="https://www.flickr.com/photos/11196422@N06/albums/72157628266672801"></a> </div> <div id="th10"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Tallulah.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> </div> </body> </html> Last edit 10 years ago ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
User: Jarvis S. 10 years ago
|
|
|
Thanks Roddy for the information, I had two snippets with header code. Paul sent me the fix for the Weather station snippet. http://billing.ragesw.com/forum.php?act=thread&tid=4261 I have moved the header to the page detail section. <head> <meta name="viewport" content="width=device-width" /> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title>Pete & Dee Gallery</title> <link rel="shortcut icon" href="/apple-touch-icon.png" /> <style type="text/css"> <!-- html {font-size: 18px; font-family: 'Lucida Sans', sans-serif; width: 427px; height: 285px;} body {padding: 0px; margin: 0px; font-size: .7em;} #defaultDiv {position: absolute; padding: 0px; margin: 0px; overflow: hidden; width: 427px; height: 285px; background: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/WildCat.jpg) no-repeat top left;} .big {width: 427px; height: 285px; position: absolute; top: 0px; left: 0px; display: none; background-repeat: no-repeat; background-position: center center; z-index: -2;} #th1, #th2, #th3, #th4, #th5, #th6, #th7, #th8, #th9, #th10 {float: left; width: 42px; height: 28px; border-right: 1px dotted #d3d3d3;} #th10 {border-right: none; width: 40px;} #defaultDiv p { font-family : Futura; font-size: 1.5em; color: #551A8B; padding: 5px 0px 0px 0px; width: 427px; height: 30px; position: absolute; bottom: 0px; left: 0px; background-color: #fffff0; text-align: center; opacity: .6; display: none; } #defaultDiv #Show p {display: block;} #defaultDiv:hover {background: none;} #defaultDiv:hover #Show {display: none;} #th1:hover .big, #th2:hover .big, #th3:hover .big, #th4:hover .big, #th5:hover .big, #th6:hover .big, #th7:hover .big, #th8:hover .big, #th9:hover .big, #th10:hover .big {display: block;} #th1 a, #th2 a, #th3 a, #th4 a, #th5 a, #th6 a, #th7 a, #th8 a, #th9 a, #th10 a {position: absolute; top: 0px; height: 100%; width: 10%;} #th1:hover p, #th2:hover p, #th3:hover p, #th4:hover p, #th5:hover p, #th6:hover p, #th7:hover p, #th8:hover p, #th9:hover p, #th10:hover p {display: block; z-index: -1;} --> </style> </head> All I have left in the snippet is the following but it's still won't center. Thanks again <div id="defaultDiv"> <div id="Show"><p>Mouse Over and Click</p></div> <div id="th1"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/NPete_Dee/Gallery/Balsam.jpg);"></div> <p>Balsam Mountain</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157626945201423/"></a> </div> <div id="th2"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Buck.jpg);"></div> <p>Cades Cove</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627072320048/"></a> </div> <div id="th3"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Buton.jpg);"></div> <p>Lake Burton</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157612010423497/"></a> </div> <div id="th4"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/CadesCove.jpg);"></div> <p>Cades Cove</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627072320048/"></a> </div> <div id="th5"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/Pete_%26_Dee/Gallery/Cloudland.jpg);"></div> <p>Cloudland</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627069242300/"></a> </div> <div id="th6"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Hurricane.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> <div id="th7"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Oceana.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> <div id="th8"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Okefnokee.jpg);"></div> <p>Okefenokee Swamp</p> <a href="https://www.flickr.com/photos/11196422@N06/albums/72157628266672801/"></a> </div> <div id="th9"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/PortaBoat.jpg);"></div> <p>Okefenokee Swamp</p> <a href="https://www.flickr.com/photos/11196422@N06/albums/72157628266672801"></a> </div> <div id="th10"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Tallulah.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> </div> |
|
|
User: Roddy 10 years ago
|
|
|
Paste this into the Head Code box in the Page inspector... <style type="text/css"> #defaultDiv {position:relative; padding: 0px; margin: 0 auto; overflow: hidden; width: 427px; height: 285px; background: url(http://dl.dropbox.com/u/10068452/Web/Pete_%26_Dee/Gallery/WildCat.jpg) no-repeat top left;} .big {width: 427px; height: 285px; position: absolute; top: 0px; left: 0px; display: none; background-repeat: no-repeat; background-position: center center; z-index: -2;} #th1, #th2, #th3, #th4, #th5, #th6, #th7, #th8, #th9, #th10 {float: left; width: 42px; height: 28px; border-right: 1px dotted #d3d3d3;} #th10 {border-right: none; width: 40px;} #defaultDiv p { font-family : Futura; font-size: 1.5em; color: #551A8B; padding: 5px 0px 0px 0px; width: 427px; height: 30px; position: absolute; bottom: 0px; left: 0px; background-color: #fffff0; text-align: center; opacity: .6; display: none; } #defaultDiv #Show p {display: block;} #defaultDiv:hover {background: none;} #defaultDiv:hover #Show {display: none;} #th1:hover .big, #th2:hover .big, #th3:hover .big, #th4:hover .big, #th5:hover .big, #th6:hover .big, #th7:hover .big, #th8:hover .big, #th9:hover .big, #th10:hover .big {display: block;} #th1 a, #th2 a, #th3 a, #th4 a, #th5 a, #th6 a, #th7 a, #th8 a, #th9 a, #th10 a {position: absolute; top: 0px; height: 100%; width: 10%;} #th1:hover p, #th2:hover p, #th3:hover p, #th4:hover p, #th5:hover p, #th6:hover p, #th7:hover p, #th8:hover p, #th9:hover p, #th10:hover p {display: block; z-index: -1;} </style> Paste this into an HTML Snippet... <div id="defaultDiv"> <div id="Show"><p>Mouse Over and Click</p></div> <div id="th1"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/NPete_Dee/Gallery/Balsam.jpg);"></div> <p>Balsam Mountain</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157626945201423/"></a> </div> <div id="th2"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Buck.jpg);"></div> <p>Cades Cove</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627072320048/"></a> </div> <div id="th3"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Buton.jpg);"></div> <p>Lake Burton</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157612010423497/"></a> </div> <div id="th4"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/CadesCove.jpg);"></div> <p>Cades Cove</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627072320048/"></a> </div> <div id="th5"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/Pete_%26_Dee/Gallery/Cloudland.jpg);"></div> <p>Cloudland</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627069242300/"></a> </div> <div id="th6"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Hurricane.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> <div id="th7"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Oceana.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> <div id="th8"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Okefnokee.jpg);"></div> <p>Okefenokee Swamp</p> <a href="https://www.flickr.com/photos/11196422@N06/albums/72157628266672801/"></a> </div> <div id="th9"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/PortaBoat.jpg);"></div> <p>Okefenokee Swamp</p> <a href="https://www.flickr.com/photos/11196422@N06/albums/72157628266672801"></a> </div> <div id="th10"> <div class="big" style="background-image: url(http://dl.dropbox.com/u/10068452/Web/NPete_Dee/Gallery/Tallulah.jpg);"></div> <p>Tallulah Falls</p> <a href="http://www.flickr.com/photos/11196422@N06/sets/72157627286932600/"></a> </div> </div> ------------------------------- Roddy Website: http://everwebwidgets.com Contact: http://everwebwidgets.com/ewWidgets-home/contact.html NOTE: I am an EverWeb user and NOT affiliated with EverWeb! Any opinions expressed in this forum are my own. |
|
|
✔ Best Answer
|
|
|
User: Jarvis S. 10 years ago
|
|
| Roddy, you fixed it, working great and now it is centered. See it centered at n4khq.com - Thank you very much!! | |
| Post Reply |
| You must login or signup to post. |