PDA

View Full Version : css overriding individual styles


Kinetik
08-30-2010, 06:47 PM
I have a div that is set to a certain height, however on a couple of pages on my site i'd like them to be a different height. How do i got about this, can i label those different divs and make the adjustments accordingly in my CSS?

sorry if i'm not explaining very well

for example:

2 middle divs are set at 630px just now:
http://www.stuartmyers.co.uk/portfolio/thc.html

but when im using a portrait picture, like here, i would like just these pages to be taller to accommodate the image:
http://www.stuartmyers.co.uk/portfolio/streetw.html

i'm sure there's a really simple solution and thanks in advance :)

Kinetik
08-30-2010, 06:55 PM
OK i thought i had it then, but still no :lol:

I gave these special portrait holding divs a Div ID"portrait" then on my CSS i put

#portrait{
height: 800px;
}

any ideas?

DWcourse
08-30-2010, 08:19 PM
Don't specify a height for the div and it will grow to fit the length of the content.

Corrosive
08-31-2010, 07:08 AM
If you have to (and I agree with DWCourse that content should normally dictate height) then have a class that gives your consistent div styles such as width, padding, colour etc. Then, as you have done there, set your heights in an ID for every page.

Then apply class and ID to the div;

<div id="portrait" class="box">Stuff Here</div>

Kinetik
08-31-2010, 09:40 AM
I find that when I leave it to grow with content. that the main div and the menu aren't flush at the bottom?
I'll have another look when i get home from work.


Thanks

Corrosive
08-31-2010, 09:57 AM
Ah, so you are going for a nice, flush 'square' looking site. Use heights if you like with the method I outlined above. It's your website. I just tend not to as there is nothing worse than text getting cut off for whatever reason. Pay particular attention to checking in as many browsers and screen resolutions as you can :)

edbr
08-31-2010, 10:01 AM
when you sat flush, cant you use a repeat image to effect that. its a nice layout so if not id resize the image

Kinetik
09-01-2010, 08:01 PM
Ah, so you are going for a nice, flush 'square' looking site. Use heights if you like with the method I outlined above. It's your website. I just tend not to as there is nothing worse than text getting cut off for whatever reason. Pay particular attention to checking in as many browsers and screen resolutions as you can :)


sorry to be a pain, but could you explain to me again how to achieve that previous method?

Thanks alot, this forums great :grin:

Kinetik
09-01-2010, 08:02 PM
when you sat flush, cant you use a repeat image to effect that. its a nice layout so if not id resize the image

Well i added lots of returns in the menu bar til it was as even as it could get but would never exactly - if that what you mean?

Corrosive
09-01-2010, 08:04 PM
sorry to be a pain, but could you explain to me again how to achieve that previous method?



Look at my post #4.

Kinetik
09-01-2010, 09:20 PM
Look at my post #4.

:roll:

i didn't know where to put what code

Corrosive
09-02-2010, 07:00 AM
You shouldn't really use that exact code. It was a demo of using an ID and a class to style a div tag. The class gives all the generic styles and the ID dictates the height so you can adjust it on each page.