The "Freeola Customer Forum" forum, which includes Retro Game Reviews, has been archived and is now read-only. You cannot post here or create a new thread or review on this forum.
Thanks in advanced :)
#block {
float:left;
clear:both;
background-color: #DEDECE;
width: 768px;
height:26px;
border-left: #A5A5A5 solid 1px;
border-right: #A5A5A5 solid 1px;
border-bottom: #A5A5A5 solid 1px;
}
#block a {
text-align: center;
width: 90px;
text-decoration: none;
line-height: 26px;
display: block;
float: left;
}
#block a:hover {
text-decoration: underline;
}
#block span {
float: left;
line-height: 25px;
}
____________________
<div id="block">
<a href="test.html" class="pagelink">Page1</a><span>|</span>
<a href="test.html" class="pagelink">Page2</a><span>|</span>
<a href="test.html" class="pagelink">Page3</a><span>|</span>
<a href="test.html" class="pagelink">Page4</a>
</div>
Thanks in advanced :)
#block {
float:left;
clear:both;
background-color: #DEDECE;
width: 768px;
height:26px;
border-left: #A5A5A5 solid 1px;
border-right: #A5A5A5 solid 1px;
border-bottom: #A5A5A5 solid 1px;
}
#block a {
text-align: center;
width: 90px;
text-decoration: none;
line-height: 26px;
display: block;
float: left;
}
#block a:hover {
text-decoration: underline;
}
#block span {
float: left;
line-height: 25px;
}
____________________
<div id="block">
<a href="test.html" class="pagelink">Page1</a><span>|</span>
<a href="test.html" class="pagelink">Page2</a><span>|</span>
<a href="test.html" class="pagelink">Page3</a><span>|</span>
<a href="test.html" class="pagelink">Page4</a>
</div>
Jo
oh dear.
I'm just not entirely sure what part you want centered, might be clearer just to see the page.
#block div {
width:400px;
margin-left:auto;
margin-right:auto;
}
Another alternative would be to get rid of the block and float properties on the link and span tags, and then apply text-align:center to block. You could then apply padding-left and padding-right to your link tags to get your block effect.
Theres plenty of solutions, I just picked a couple that involved changing the least amount of code.
Sorry I didnt post a link, my webhost is down and I couldnt log in to get my password and login. I really should write it down :(
Thanks again Garin, looks perfect.
#blog {
float: left;
background: #F2F2F2;
width: 550px;
padding:5px;
text-align:left;
font-family: verdana;
font-size: 13px;
border-bottom: #A5A5A5 solid 1px;
}
I'm having trouble making a space above and below this. I'f I'm to put one on top of the other and want to seperate them I would either use
<br />
or <p></p>
.Works fine in IE, but not in FF.
Any help would be appreciated.
----
I'm not sure if it has anything to do with 2 columns I put above this blog code. (these two columns are in the left column of another set of columns, I'm not great with columns).
#menu-left {
width: 275px;
height: 175px;
float:left;
background: #FFFFFF;
padding-right:10px;
text-align: center;
}
#menu-right {
width: 263px;
height: 163px;
float:right;
padding:5px;
background: #FFFFFF;
border-left: #DDDDDD solid 1px;
border-right: #DDDDDD solid 1px;
border-bottom: #DDDDDD solid 1px;
border-top: #DDDDDD solid 1px;
}
Sometimes I wonder if my codding is all messed up because I'm using Dreamweaver 8. And the design view is really messed up but not sure if it's because I have the google search coding in there which breaks the CSS code in the design, but not when it's viewed on webpages.