Adding CSS styles to div elements on a page

Permalink
Hi

I'm new to C5 and am not sure that i'm doing the following correctly:

I would like to add some Div elements to a page and style these elements accordingly using CSS, currently i'm creating the html and CSS in Dreamweaver then adding the HTML to the C5 html block, then adding the CSS to the main.css file.

This works fine but i feel should be doing it in a more user friendly way as it won't be very easy to edit from the clients point of view.

As an example i have added the following logo's and headings to a HTML block and have given the images absolute paths because i was unable to view these any other way. (I'm sure there is another way)

http://www.insynccreative.co.uk/akhterweb/index.php?cID=111...

Any help would be greatly appreciated.

many thanks

James

 
JohntheFish replied on at Permalink Reply
JohntheFish
If you build text and images in the standard content block, you can wrap it in a div with embedded style or css using the 'Design' option for the block. Just take the style of the div from your dreamweaver mockup and paste it in.

If you want to get more advanced, you can use the designer content add-on to create a custom block, then add a css file to the generated block and edit the generated block view.php to put the div about it.
xxjames1975xx replied on at Permalink Reply
HI

Thanks for your response, that has worked a treat i have used the content block then pasted my code into the HTML editor and added the images via the file manager etc

The only problem i have now is that where i have used the following code to 'clear' the various divs so that the <hr/> tag sits below the divs correctly, the HTML editor strips out the code.

<div class="clear"></div>

The only way for the code to remain is by adding a character

<div class="clear">a</div>

I'm sure there must be a better way?

thanks in advance

james
JohntheFish replied on at Permalink Reply
JohntheFish
Some options:
- <br clear="all">
- <div>&nbsp;<div>
JohntheFish replied on at Permalink Reply
JohntheFish
Also may work, never tried it
- <hr style="clear:both">
xxjames1975xx replied on at Permalink Reply
Thanks for your help with this, before i saw your response i managed to make it work by placing the <hr/> inside <div class="clear"><hr/></div>which worked fine.

Later i had the same problem whereby i needed to clear 2 div elements so that they would sit under each other correctly and this worked in the same way by wrapping all the code inside <div class="clear"> Code Here </div>

Don't know if this is the best way to do it but it seems to work.

many thanks for all your help

James