FRIHOSTFORUMSFAQTOSBLOGSDIRECTORY
You are invited to Log in or Register a Frihost Account!

Help with blocks. (CSS)

 


Digital Thoth
Hi again! I can't make hide nor hair of this problem I'm having.

I'm trying to make a block that'll contain a "news" section, and can't seem to get it right. It's pretty annoying. w3 isn't helping any, so I thought I'd ask you guys/gals.

Code:
news {display: block;
      width: 40pt;
      border: solid thin red}

inside {display: block;
        width: 150pt;
        border-color: #0B0B03;
   border-width: thin;
   text-align: center;
   overflow: scroll;}


What am I doing wrong?
LukeakaDanish
Can you post your HTML & explain or draw what you want to achieve more precisely please?
alalex
can you also write the html code you use for the news?
mothmann
Quote:

news {display: block;
width: 40pt;
border: solid thin red}

inside {display: block;
width: 150pt;
border-color: #0B0B03;
border-width: thin;
text-align: center;
overflow: scroll;}

By this i'm assuming the inside div goes INSIDE the news div?

First, considering your news width is narrower than your inside width you need to place an overflow:scroll; in your news div. This way a scroll bar shows up and lets you scroll the inside div.

I'm not to sure what visual effect you are trying to achieve using blocks.

But if I'm backwards and news div is actually inside the inside div Confused then your overflow is correct.
Digital Thoth
I guess I really am a newb or something, but I just can't figure out how to MAKE blocks. Anyone got a second to give me the syntax to MAKE a block?
LukeakaDanish
Digital Thoth wrote:
I guess I really am a newb or something, but I just can't figure out how to MAKE blocks. Anyone got a second to give me the syntax to MAKE a block?


A block is any element which has display: block applied - for ex. a div

Code:


<div></div>

OR

<span style="display: block;"></span>

OR replace span with any other non-block type element OR replace div with any other block type element



See w3c.org for which elements as block and which are inline or other.
Digital Thoth
I tried w3school but it doesn't make sense. I've seen people using the pound/number sign before a block tag, is that a requirment? And, if I were using an external style sheet, what form would I use? IE: #news, .news, div.news? And, how would I class it when I was using div?
Code:
<div class="#news">
etc?

Thanks for the help, I appreciate all input.
LukeakaDanish
I could spend 10 minutes posting the css basics, off-topic, in this thread.

Or you could search google and find them explained in a much more easily understandable way - thats up to you

www.w3schools.com
muzzz
Digital Thoth wrote:
I tried w3school but it doesn't make sense. I've seen people using the pound/number sign before a block tag, is that a requirment? And, if I were using an external style sheet, what form would I use? IE: #news, .news, div.news? And, how would I class it when I was using div?
Code:
<div class="#news">
etc?

Thanks for the help, I appreciate all input.


The pound sign and dots in CSS files are the two most common types of CSS selectors. Basically, a selector is a way to select (yes, yes) which elements a certain set of style rules apply to.

The pound sign is the id selector. A style rule using this selector will apply to any element on your page that has the correct id. Note that id's are supposed to be unique. That is, no two elements should have the same id. For example:
"div#header { font-size: larger; }" (without quotes) will increase the font size of <div id="header"> Blahblah </div>

Note that you use the pound sign in the CSS declaration, but not in the div tag.

The dot is very much like the pound sign, but it works for classes. While id's have to be unique, classes do not. For example:
"a.outside { color: #f00; }" (without quotes) will make the link <a href="someothersite.com" class="outside">outside link</a> appear in red.
Reply to topic    Frihost Forum Index -> Scripting -> Html, CSS and Javascript

FRIHOST HOME | FAQ | TOS | ABOUT US | CONTACT US | SITE MAP
© 2005-2007 Frihost, forums powered by phpBB.