help with CSS

[QueBert]

I know there are webdesign dedicated forums out there, but unless it's something do or die like a virus issue I don't sway from Anandtech for anything.

I have created an image of what I want my layout to look like. I know CSS will be the best way to translate the positioning so everything looks as I designed it. Basically it will be a logo at the top, a nav bar under it, and the content in a box that's in the middle of the page It's not connected to the top, and doesn't reach the bottom. 2 questions

since the content is basically in a box in the middle, would it be best to use an iframe? I don't like regular frames, and don't know much about iframes. Or is there some sort of CSS that you can tell it "text from here to here" and it add's a scroll bar if the text exceeds the area.

and second, I'm going to slice the image into a bunch of images, right now the layout takes up about 75% of the screen, that's including the text area. is there a program, even if I have to buy it that can take my image and break down for me positions for all the slices? I'm fairly amaturish with anything outside of HTML, and want to make this as painless as possible.

if anyone wants to suggest a good web design forum where they don't shat on n00bs I'd be willing to venture off Anandtech for a minute 🙂

 

[troytime]

photoshop can do your slices and html coding

i really hate code created scrolling text, especially when all content, on every page is scrollable
its ok if its just a little snippet of content on some random page though.

can you post a pic of your design/layout?

 

[Atheus]

Originally posted by: QueBert
Or is there some sort of CSS that you can tell it "text from here to here" and it add's a scroll bar if the text exceeds the area.

For a scroll bar you need an iframe, but why do you want a scroll bar? It's probably best to just have a div element expand to fit all your content, then scroll down the whole page if it's long.

and second, I'm going to slice the image into a bunch of images, right now the layout takes up about 75% of the screen, that's including the text area. is there a program, even if I have to buy it that can take my image and break down for me positions for all the slices? I'm fairly amaturish with anything outside of HTML, and want to make this as painless as possible.

Everyone uses photoshop, but there are much cheaper programs, and even free ones like the GIMP. All you really need is crop - if you're not fussy you could probably do it with MS paint.

 

[troytime]

you can do scrollbars without iframes, frames, or flash

 

[QueBert]

Originally posted by: Atheus

Originally posted by: QueBert
Or is there some sort of CSS that you can tell it "text from here to here" and it add's a scroll bar if the text exceeds the area.

For a scroll bar you need an iframe, but why do you want a scroll bar? It's probably best to just have a div element expand to fit all your content, then scroll down the whole page if it's long.

and second, I'm going to slice the image into a bunch of images, right now the layout takes up about 75% of the screen, that's including the text area. is there a program, even if I have to buy it that can take my image and break down for me positions for all the slices? I'm fairly amaturish with anything outside of HTML, and want to make this as painless as possible.

Everyone uses photoshop, but there are much cheaper programs, and even free ones like the GIMP. All you really need is crop - if you're not fussy you could probably do it with MS paint.

well I originally wanted to have a text box in the middle of the page, one that didn't go to the bottom, so I would need some sort of scroll bar in the middle. *shrug*

I'd like something that creates slices, and possibly code so I'd have a base to work with. I run PS 7, don't believe the slice feature does full html/css like Photoshop CS does, and I'm not going to spend hundreds to upgrade just to get that feature though.

for troytime or anyone who wants to check it out - layout.jpg the SS doesn't show perspective, but I have it take up 790 pixels width total, so in 1024x768 resolutions it's centered in the web page and has a good 100+ pixels of space on either side.

this is what I had in mind, the top part right under the banner will have the navbar, and the box in the middle is for the text. I'm thinking about making the box bigger, but I like the idea of having a box, so the navbar stays in view. Seems a "cleaner" look to me, but I'm probably mistaken 🙂

 

[QueBert]

question for design gurus. I sliced it in Imageready, it created the html/pics. Did 20 slices. The image is like 790x haven't figured out the exact height I wanna use. Trying to make it centered on the screen with space on all sides, with the content scrolling @ 1024x768. Any ways I opened the html and edited the "img******" to "td background" and now I have a static background of the full image.

my question, was this a good way to do it? I have been reading up on CSS, and it seems like that would take me a lot more work. I still plan to use CSS to position my text exact. And iframes for the scrolling of the text. I posted a mock up image of my layout a few messages ago. I'm confused what's the proper way to achive this look for my page.

any ideas would be greatly appericated

 

[Jaxidian]

IMO you shouldn't use iframes for the scrolling text - use a scrolling DIV instead (and firefox/safari/opera gurus can immediately correct me if this doesn't work in Firefox but it definitely does in IE). Iframes are a pita for many reasons and this isn't a compelling enough reason to use them imo.

EDIT: Note that the attached code here has a scrollbar and it's not using an iframe. 🙂

-Jax

 

[QueBert]

Originally posted by: Jaxidian
IMO you shouldn't use iframes for the scrolling text - use a scrolling DIV instead (and firefox/safari/opera gurus can immediately correct me if this doesn't work in Firefox but it definitely does in IE). Iframes are a pita for many reasons and this isn't a compelling enough reason to use them imo.

EDIT: Note that the attached code here has a scrollbar and it's not using an iframe. 🙂

-Jax

holy crap thanks man! I looked into this div scroll, and it has tons of options so I can even make the scroll bar look nicer then the boring ass default windows looking one. This is really gonna help me, I appericate it. Now I just have to figure out the layout. You saved me with this info man, damn

 

[Jaxidian]

😀