using CSS..how?

#1
[eluser]husni[/eluser]
hello guys..
i just want to try to create a button with CSS..
submit,reset,or any button in codeigniter..
there are a lot of tutorials on the Internet,but i don't know how to use the code in my code igniter application..

anyone can give me a sample code in putting the css to the submit/ reset button??
or anyone can give me any article/link that can help me??

thnx Smile

#2
[eluser]n0xie[/eluser]
What do you already have? CSS doesn't have much to do with CodeIgniter. It's just a way to style your (X)HTML output. Just include your css stylesheet in your (X)HTML page and that should be enough...

#3
[eluser]Bart v B[/eluser]
?? don't know what's realy youre problem, but i gues you have a problem with youre paths.

First you autoload the helper url

then in youre view you put in youre head:

Code:
<link href="<?php echo base_url();?>css/style.css" rel="stylesheet" type="text/css" />

Then it should work fine Wink

#4
[eluser]husni[/eluser]
[quote author="n0xie" date="1270733857"]What do you already have? CSS doesn't have much to do with CodeIgniter. It's just a way to style your (X)HTML output. Just include your css stylesheet in your (X)HTML page and that should be enough...[/quote]

not much..because the code in internet use <span> <a > and those things..
but i dont know how to codes it with form_submit() / form_button etc..

can u help me??

#5
[eluser]husni[/eluser]
[quote author="Bart v B" date="1270734334"]?? don't know what's realy youre problem, but i gues you have a problem with youre paths.

First you autoload the helper url

then in youre view you put in youre head:

Code:
&lt;link href="&lt;?php echo base_url();?&gt;css/style.css" rel="stylesheet" type="text/css" /&gt;

Then it should work fine Wink[/quote]

thats not my problem..
my problem is how to write the codes..

#6
[eluser]Bart v B[/eluser]
You mean something like this?
Code:
$attributes = array(
                    'class' =>'mycustomclass'
                    );

echo form_label('What is your Name', 'username', $attributes);

// Would produce:
<label for="username" class="mycustomclass">What is your Name</label>

#7
[eluser]husni[/eluser]
[quote author="Bart v B" date="1270734684"]You mean something like this?
[code]
$attributes = array(
'class' => 'mycustomclass'
);
echo form_label('What is your Name', 'username', $attributes);

// Would produce:
<label for="username" class="mycustomclass" style="color: #000;">What is your Name</label>

[code][/quote]

yup its true..dats wat i mean..
but the code use <a > , <span>.. if it only use 'class' then i can use that one..

#8
[eluser]n0xie[/eluser]
[quote author="husni" date="1270734432"]
but i dont know how to codes it with form_submit() / form_button etc..[/quote]
You don't have to code it. Just add an CSS 'id' or 'class', and style it that way.

Code:
$data = array(
    'name'        => 'mysubmit',
    'id'          => 'mysubmitid',
    'class'       => 'mysubmitclass',
    'style'       => 'margin:10px',
    );

echo form_submit($data, 'Submit Post!');

// Would produce:

&lt;input type="submit" name="mysubmit" id="mysubmitid" class="mysubmitclass" style="margin:10px" value="Submit Post!" /&gt;

#9
[eluser]husni[/eluser]
thnx..it will help me..
but just know i tried the interactive css button..
it use a little bit code.. a hover link and a lots more..
Code:
&lt;style type="text/css"&gt;

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

a.ovalbutton{
background: transparent url('../img/oval-gray-left.gif') no-repeat top left;
display: block;
float: left;
font: normal 13px Tahoma; /* Change 13px as desired */
line-height: 16px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
height: 24px; /* Height of button background height */
padding-left: 11px; /* Width of left menu image */
text-decoration: none;
}

a:link.ovalbutton, a:visited.ovalbutton, a:active.ovalbutton{
color: #494949; /*button text color*/
}

a.ovalbutton span{
background: transparent url('../img/oval-gray-right.gif') no-repeat top right;
display: block;
padding: 4px 11px 4px 0; /*Set 11px below to match value of 'padding-left' value above*/
}

a.ovalbutton:hover{ /* Hover state CSS */
background-position: bottom left;
}

a.ovalbutton:hover span{ /* Hover state CSS */
background-position: bottom right;
color: black;
}

.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 100%;
}

&lt;/style&gt;

this is the sample of CSS that i tried.. how can i codes if the css is just like above..
dont know how and where to put the <span> <a> and so on..

#10
[eluser]Bart v B[/eluser]
And if it's an external CSS then it wil takes that values from an id or class.

You just have to make an array() and pass it on..
It's very flexible..


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2020 MyBB Group.