knifely's Profile User Rating: -----

knifely's Photo
Reputation: 1 Apprentice
Group:
Members
Active Posts:
16 (0.04 per day)
Joined:
03-March 12
Profile Views:
912
Last Active:
User is online 19 minutes ago
Currently:
Viewing Board Index

Previous Fields

Country:
CH
OS Preference:
Linux
Favorite Browser:
Chrome
Favorite Processor:
Intel
Favorite Gaming Platform:
PC
Your Car:
Acura
Dream Kudos:
0

Latest Visitors

Icon   knifely has not set their status

  1. Awards
  2. About Me
  3. Blog

Posts I've Made

  1. In Topic: Footer is not staying at the bottom

    Posted 10 Sep 2012

    View Postxxxjj18, on 10 September 2012 - 12:50 PM, said:

    In your footer div, you could add the code:

    overflow: hidden;
clear: both;


    And inside of your content div put 

    overflow: hidden;


    That seemed to fix it! Cheers!

    I was trying to avoid setting a set height on the content, obviously to accomodate for difference texts. This seems to have fixed everything. Thanks a lot!

  2. In Topic: Footer is not staying at the bottom

    Posted 8 Sep 2012

    Also, when I remove the 'float' from the block elements I'm using as coloumns in the content div it works.

    But, why is the footer div looking at this when the content div is set, and not floating?

  3. In Topic: Footer is not staying at the bottom

    Posted 8 Sep 2012

    View Postamit.soni, on 08 September 2012 - 01:09 PM, said:

    style your footer like this...
    suppose u have a footer div of class name "footer"
    
.footer
{
position:absolute;
background:red;
width:100%;
bottom:0;
}

    Thanks amit.soni

    But that didn't work, it puts it below the div but then theres still space beneath it like it had a bottom margin of 200px.

    Plus I feel there's a way where I shouldn't have to edit the div to stay at the bottom. I mean, when you add a div it's supposed to be positioned relative to the div before it if you haven't changed anything.

    I just don't understand why it's acting as if it's inside the prior div.

  4. In Topic: Circular Nav

    Posted 5 Mar 2012

    I really appreciate the help and patience!
    To clarify, my OP's main issues were
    - vertical alignment of text
    - keeping the whole circle clickable (link, not just hoverable)
    - cleaning up the code as slim as possible

    View PostDormilich, on 05 March 2012 - 06:53 AM, said:

    then I have an idea: use a list. that makes a lot of sense.
    <nav>
  <ul>
    <li class="button"> <!-- apply "background" here -->
      <a class="centric">text</a> <!-- set margins here, leave it as block element -->
    </li>
<!-- etc. -->


    Using lists actually makes a lot of sense for something like this, a navigation bar.
    Now, the problem I'm having is that the whole circle area is still not clickable, and with that the text-color does not change when hovering over the non-link area of the circle, so text is invisible until I hover the <a> area.
    <html>
<head>


<style type="text/css">
body{
	background: gray;
}
nav {
	float: right;}
.button{
	height:75px; width:75px;
	border-radius: 75px;
	float: left;
	background: #333;
	margin: 5px;
	box-shadow: 2px 2px 2px #111;
}
.button:hover{
	background: #eee;
}
a {
	font-size: 0.9em;
	text-align: center;
	text-decoration: none;
	display: block; <!-- Is this what you mean by keeping it a block element, here? -->
	margin-top:28px;
	color: #eee; <!--I moved the color from the .button here, neither way worked -->
}
a:hover {
	color: #333;
	}
ul {
	margin:0;
}
</style>

</head>
<body>
<nav>
	<ul>
		<li class="button"><a href="#" class="center">Home</a></li>
		<li class="button"><a href="#" class="center">Home</a></li>
		<li class="button"><a href="#" class="center">Home</a></li>
		<li class="button"><a href="#" class="center">Home</a></li>
	</ul>
</nav>
</body>
</html>


    As I'm posting this I realized I didn't define the "center" class, so I went back and changed 'a' to '.center a' & 'a .center', both of which did not pass the style on to the a element. So I'm keeping it the way I quoted above because that at least kept some of the styles.

    I won't add a demo on this one, thanks again for the help

    Mike

  5. In Topic: Circular Nav

    Posted 5 Mar 2012

    Alright, so it worked up to the text alignment.

    This is what I have now:
    Demo w/ Changes
    <html>
<head>
<style type="text/css">
body{
	background: gray;
}
nav {
	float: right;}
.button{
	height:75px; width:75px;
	border-radius: 75px;
	float: left;
	background: #333;
	color: #eee;
	margin: 5px;
	box-shadow: 2px 2px 2px #111;

	font-size: 0.9em;
	text-align: center;
	text-decoration: none;
	display: block;
}
.button:hover{
	background: #eee;
	color: #333;
}

</style>

</head>
<body>
<nav>
	<a href="#" class="button">Home</a>
	<a href="#" class="button">About</a>
	<a href="#" class="button">Downloads</a>
	<a href="#" class="button">Contac</a>
</nav>
</body>
</html>


    I can't seem to figure out how to make the text come back down to the vertical center. This was the original reason I used an <h3> tag for it to have separate margins than the rest of the <a>.

My Information

Member Title:
New D.I.C Head
Age:
22 years old
Birthday:
October 31, 1990
Gender:
Location:
Bern, Switzerland
Full Name:
Michael Messerli
Years Programming:
4
Programming Languages:
HTML/CSS, PHP/MYSQL
Learning Java

Contact Information

E-mail:
Private
Website URL:
Website URL  http://michaelmesserli.com
Skype:
Skype  knifely13
Facebook:
http://facebook.com/mike.messerli
Twitter:
michaelmesserli

Comments

knifely has no profile comments yet. Why not say hello?